<template>
  <div class="campaign-management-box" id="campaing-box-1">
    <basic-container v-if="pageType === 1">
      <div class="header" id="header-1">
        <beetles-search :size="'mini'" @search-form="searchForm" @empty-form="emptyForm();getDataByTab()"
                        :expend="false"
                        id="search-1">
          <template slot-scope="{searchConceal}" slot="searchForm" :style="{height:searchConceal? 'auto' :'40px'}"
                    style="overflow:hidden" id="search-2">
            <el-form class="campaign-search" :model="queryForm" ref="queryForm" inline label-width="100px"
                     id="campaign-from-1">
              <el-form-item label="时间范围:">
                <el-date-picker
                  style="width: 260px"
                  size="mini"
                  v-model="queryForm.queryAudienceDate"
                  type="daterange"
                  align="right"
                  unlink-panels
                  id="date-picker-1"
                  value-format="yyyy-MM-dd"
                  range-separator="至"
                  start-placeholder="开始日期"
                  end-placeholder="结束日期"
                  :pickerOptions="audiencePickerOptions"
                  :clearable="false"
                  @change="getAudiencesDataByTab">
                </el-date-picker>
              </el-form-item>
              <el-form-item label="账户ID:">
                <el-select
                  style="width: 300px"
                  size="mini"
                  collapse-tags
                  clearable
                  multiple
                  filterable
                  v-model="queryForm.platformId"
                >
                  <el-option
                    v-for="item in accountList2"
                    :key="item.id"
                    :value="item.platformId"
                    :label="item.name+'ID:'+item.platformId">
                  </el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="推广系列:">
                <el-input
                  style="width: 280px"
                  v-model.trim="queryForm.campaignName"
                  clearable
                  id="campaignName-1"
                  size="mini"
                  placeholder="请输入"
                />
              </el-form-item>
              <el-form-item label="广告组名称:">
                <el-input
                  v-model.trim="queryForm.adgroupName"
                  clearable
                  id="adgroupName-1"
                  size="mini"
                  placeholder="请输入"
                />
              </el-form-item>

              <el-form-item label="广告名称:">
                <el-input
                  v-model.trim="queryForm.adName"
                  clearable
                  id="adName-1"
                  size="mini"
                  placeholder="请输入"
                />
              </el-form-item>

              <el-form-item label="地域:">
                <el-select
                  size="mini"
                  id="locationIds-1"
                  collapse-tags
                  clearable
                  multiple
                  filterable
                  v-model="queryForm.locationIds"
                >
                  <el-option
                    v-for="item in locationList2"
                    :key="item.value"
                    :value="item.value"
                    :label="item.label">
                  </el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="状态:">
                <el-select
                  size="mini"
                  collapse-tags
                  clearable
                  multiple
                  filterable
                  id="statusList-1"
                  v-model="queryForm.statusList"
                >
                  <el-option
                    v-for="item in statueValueList"
                    :key="item.value"
                    :value="item.value"
                    :label="item.label">
                  </el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="版位:">
                <el-select
                  size="mini"
                  collapse-tags
                  clearable
                  multiple
                  id="placement-1"
                  filterable
                  v-model="queryForm.placement"
                >
                  <el-option
                    v-for="item in placementsList"
                    :key="item.value"
                    :value="item.value"
                    :label="item.label">
                  </el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="年龄:">
                <el-select
                  size="mini"
                  collapse-tags
                  id="age-1"
                  clearable
                  multiple
                  filterable
                  v-model="queryForm.age"
                >
                  <el-option
                    v-for="item in ageGroupsList"
                    :key="item.value"
                    :value="item.value"
                    :label="item.label">
                  </el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="性别:">
                <el-select
                  size="mini"
                  collapse-tags
                  id="gender-1"
                  clearable
                  multiple
                  filterable
                  v-model="queryForm.gender"
                >
                  <el-option
                    v-for="item in genderList"
                    :key="item.value"
                    :value="item.value"
                    :label="item.label">
                  </el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="竞价策略:">
                <el-select
                  size="mini"
                  collapse-tags
                  id="bidType-1"
                  clearable
                  multiple
                  filterable
                  v-model="queryForm.bidType"
                >
                  <el-option
                    v-for="item in bidTypeList"
                    :key="item.value"
                    :value="item.value"
                    :label="item.label">
                  </el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="投放速度:">
                <el-select
                  size="mini"
                  collapse-tags
                  clearable
                  id="pacing-1"
                  multiple
                  filterable
                  v-model="queryForm.pacing"
                >
                  <el-option
                    v-for="item in pacingList"
                    :key="item.value"
                    :value="item.value"
                    :label="item.label">
                  </el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="竞价模式:">
                <el-select
                  size="mini"
                  collapse-tags
                  id="billingEvent-1"
                  clearable
                  multiple
                  filterable
                  v-model="queryForm.billingEvent"
                >
                  <el-option
                    v-for="item in billingEventList"
                    :key="item.value"
                    :value="item.value"
                    :label="item.label">
                  </el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="广告组设置:">
                <el-select
                  size="mini"
                  collapse-tags
                  id="creativeMaterialMode-1"
                  clearable
                  multiple
                  filterable
                  v-model="queryForm.creativeMaterialMode"
                >
                  <el-option
                    v-for="item in creativeMaterialModelist"
                    :key="item.value"
                    :value="item.value"
                    :label="item.label">
                  </el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="素材样式:">
                <el-select
                  size="mini"
                  collapse-tags
                  id="creativeType-1"
                  clearable
                  multiple
                  filterable
                  v-model="queryForm.creativeType"
                >
                  <el-option
                    v-for="item in creativeTypeList"
                    :key="item.value"
                    :value="item.value"
                    :label="item.label">
                  </el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="推广系列类型:">
                <el-select
                  size="mini"
                  collapse-tags
                  id="creativeType-1"
                  clearable
                  multiple
                  filterable
                  @change="selectCampTypes"
                  v-model="queryForm.campaignTypes"
                >
                  <el-option key="All" value="ALL" label="All" @click.native="selectCampTypeAll"></el-option>
                  <el-option
                    v-for="item in campaignTypeList"
                    :key="item.value"
                    :value="item.value"
                    :label="item.label">
                  </el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="创建者:">
                <el-select
                  size="mini"
                  collapse-tags
                  id="create_user-1"
                  clearable
                  multiple
                  filterable
                  @change="selectCreators"
                  v-model="queryForm.creators"
                >
                  <el-option
                    v-for="item in creatorsList"
                    :key="item.value"
                    :value="item.value"
                    :label="item.label">
                  </el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="优化类型:">
                <el-select
                  size="mini"
                  collapse-tags
                  clearable
                  multiple
                  filterable
                  v-model="queryForm.adTypes"
                >
                  <el-option
                    v-for="item in optimizeTypeList"
                    :key="item.value"
                    :value="item.value"
                    :label="item.label">
                  </el-option>
                </el-select>
              </el-form-item>
            </el-form>
          </template>
        </beetles-search>
        <!--日期与模板-->
        <!--<div class="header-up">-->
        <!--  <div class="date-template">-->
        <!--    <div class="dt-item">-->
        <!--      <span style="font-size: 14px; color: #666666; margin-right: 5px"></span>-->
        <!--      <el-date-picker-->
        <!--        size="mini"-->
        <!--        v-model="queryAudienceDate"-->
        <!--        type="daterange"-->
        <!--        align="right"-->
        <!--        unlink-panels-->
        <!--        value-format="yyyy-MM-dd"-->
        <!--        range-separator="至"-->
        <!--        start-placeholder="开始日期"-->
        <!--        end-placeholder="结束日期"-->
        <!--        :pickerOptions="audiencePickerOptions"-->
        <!--        :clearable="false"-->
        <!--        @change="getAudiencesDataByTab">-->
        <!--      </el-date-picker>-->
        <!--    </div>-->
        <!--    <div class="dt-item">-->
        <!--      &lt;!&ndash;筛选条件&ndash;&gt;-->
        <!--      <cs-filter-query ref="csFilterQueryRef" :options="filterQueryOptions"-->
        <!--                       @change="handleChangeFilter"></cs-filter-query>-->
        <!--    </div>-->
        <!--  </div>-->
        <!--</div>-->
        <div class="header-right-box">


          <!--          <creative-pull></creative-pull>-->
          <campaign-tasks ref="campaignTasks" :offer-id="offerId"
                          @click-edit="handleTaskEdit"></campaign-tasks>
        </div>

      </div>
      <el-tabs class="t-tabs" type="card" v-model="activeName" @tab-click="handleClickTab"
               :before-leave="handlerBeforeLeaveTabs" id="t-tabs-1">
        <el-tab-pane name="campaign" id="campaing-boxs-1">
          <span slot="label" id="spna-label">
            推广系列 <el-tag style="float:right;margin-top: 5px" v-show="selectedCampaigns.length!==0" closable
                         @close="handleCloseCampaigns()">已选{{ selectedCampaigns.length }}项</el-tag>
          </span>
          <div class="curd-table" id="curd-table-1">
            <div class="tab-header clearfix" id="tab-header-1">
              <div class="tab-header-left" id="tab-header-left1-">
                <!--<el-button  type="primary"  id="button-add-1">新建</el-button>-->
                <el-dropdown split-button type="primary" size="mini" plain @click="createCampaign"
                             @command="createCampaignFromTemp">
                  新建
                  <el-dropdown-menu slot="dropdown">
                    <el-dropdown-item command="1">从模板中创建</el-dropdown-item>
                  </el-dropdown-menu>
                </el-dropdown>
                <el-dropdown @command="handleBatchUpdateCampaignCommand">
                  <el-button size="mini" id="el-update">
                    修改<i class="el-icon-arrow-down el-icon--right" id="el-icon"></i>
                  </el-button>
                  <el-dropdown-menu slot="dropdown" id="dropdown">
                    <el-dropdown-item command="handleBatchStartCampaign" id="dropdown-handleBatchStartCampaign-1">开启
                    </el-dropdown-item>
                    <el-dropdown-item command="handleBatchStopCampaign" id="dropdown-handleBatchStopCampaign1-1">停止
                    </el-dropdown-item>
                    <el-dropdown-item command="handleBatchUpdateCampNames" id='dropdown-handleBatchUpdateCampNames-1'>
                      修改名称
                    </el-dropdown-item>
                    <el-dropdown-item command="handleBatchUpdateCampBudget" id="dropdown-handleBatchUpdateCampBudget-1">
                      修改预算
                    </el-dropdown-item>
                  </el-dropdown-menu>
                </el-dropdown>
              </div>
              <div class="tab-header-right" id="tab-header-right-1">
                <el-switch
                  v-model="statusVal"
                  :active-color="activeColor"
                  :inactive-color="inactiveColor"
                  active-text="显示创建失败"
                  inactive-text=""
                  @change="showStatusByFail"
                >
                </el-switch>
                <el-select size="mini" style="width: 150px;" v-model="campaignAudience"
                           placeholder="细分数据"
                           id="campaign-select-1"
                           @change="getCampaignAudiencesDataList">
                  <el-option
                    v-for="item in filterAudienceList"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                  </el-option>
                </el-select>
                <common-cpn :template-list="templateList" @custom-col="tableColumnDrawer=true" @default-col="()=>{
                  this.changeDefualtTemplate()
                  this.sortMap={}
                  this.getDataByTab
              }" :template-val.sync="templateVal" @change-template="handleChangeTemplate"
                            @del-template="deleteTemplate"
                            @save-template="showTemplateDialog"></common-cpn>

              </div>
            </div>
            <div class="table-body" id="campaign-table">
              <el-table
                v-loading="campaignLoading"
                element-loading-text="加载中"
                element-loading-spinner="el-icon-loading"
                element-loading-background="rgba(255, 255, 255, 0.5)"
                :data="campaignTableData"
                border
                stripe
                ref="campaignTableData"
                :summary-method="getCampaignSummaries"
                show-summary
                style="width: 100%"
                default-expand-all
                row-key="id"
                id="table-TableData"
                :tree-props="{children: 'children', hasChildren: 'hasChildren'}"
                :row-style="iRowStyle"
                :header-cell-style="iHeaderCellStyle"
                @sort-change="sortChange"
                @selection-change="handleCampaignSelectionChange">
                <el-table-column
                  type="selection"
                  width="55"
                  :reserve-selection="true"
                  align="center">
                </el-table-column>
                <el-table-column
                  fixed="left"
                  prop="operationStatus"
                  label="开关"
                  id="operation"
                >
                  <template v-slot="{row}">
                    <template v-if="row.status !== -1">
                      <el-switch
                        v-if="row.campaignId !== -1"
                        :value="row.operationStatus"
                        :active-color="activeColor"
                        :inactive-color="inactiveColor"
                        active-text=""
                        inactive-text=""
                        id="swith-1"
                        :active-value="'ENABLE'"
                        :inactive-value="'DISABLE'"
                        :disabled="row.ttCampaignId ===''"
                        @change="changeCampaignStatus(row)">
                      </el-switch>
                    </template>
                  </template>
                </el-table-column>
                <el-table-column
                  fixed="left"
                  prop="campaignName"
                  id="el-campaignName-1"
                  label="推广系列名称"
                  width="300">
                  <template v-slot="{row}" id="tow-name-1">
                    <template v-if="row.status !== -1">
                      <el-tooltip effect="dark" :content="row.campaignName" placement="top" class="name-tip"
                                  id="tooltip-top-1">
                        <div @mouseover="row.showOpt=1" @mouseleave="row.showOpt=0">
                          <div class="name-tip-content">
                            <i class="myicon icon-RO" v-show="row.adTypes.indexOf('RO') !== -1"></i>
                            <!--<i class="myicon icon-VEO" v-show="row.adTypes.indexOf('VEO') !== -1"></i>-->
                            <i class="myicon icon-ACO" v-show="row.creativeMaterialMode === 'DYNAMIC'"></i>
                            <i class="myicon icon-APPO" v-show="row.campaignAppProfilePageState === 'ON'"></i>
                            <i class="myicon icon-SPC" v-show="row.isSmartPerformanceCampaign === 1"></i>
                            <el-button type="text" class="over-flow-ellipsis main-tilte"
                                       @click="gotoAdGroupTable(row)">
                              {{ row.campaignName }}
                            </el-button>
                            <i
                              v-show="!(row.status ===1 || row.status === 3)" class="el-icon-edit"
                              @click="showEditCampaignName(row)"></i>
                          </div>
                          <el-collapse-transition>
                            <div v-show="row.showOpt" style="position: absolute">
                              <el-button v-show="row.ttCampaignId !== ''" type="text" size="mini" icon="el-icon-share"
                                         @click="showCopyCampaignDialog(row)" id="el-cp-buttom-1">
                                复制
                              </el-button>
                              <el-button v-if="row.campaignId !== -1" type="text" size="mini"
                                         icon="el-icon-edit" @click="handleEditCampaign(row)" id="el-update-2">编辑
                              </el-button>
                            </div>
                          </el-collapse-transition>
                        </div>
                      </el-tooltip>
                      <el-tooltip v-if="row.reason !== ''" style="width: 12px" effect="dark" :content="row.reason"
                                  placement="right" id="right-1">
                        <i class="el-icon-warning warning" id="el-icon-warning"></i>
                      </el-tooltip>
                    </template>
                    <template v-else>
                      {{ row.campaignName }}
                    </template>
                  </template>
                </el-table-column>
                <el-table-column
                  id="el-status-display"
                  prop="status"
                  label="状态">
                  <template v-slot="{row}">
                    <template v-if="row.status !== -1">
                      <div class="tiktok-status-display" id="status-display-1">
                        <div>
                          {{ formatterTtStatus(row.status, 'index', 'campaign') }}
                        </div>
                        <span>
                        {{ formatterTtStatus(row.ttStatus, 'key', 'campaign') }}
                      </span>
                      </div>
                    </template>
                  </template>
                </el-table-column>
                <el-table-column
                  prop="budget"
                  label="预算USD"
                  id="el-budget-2"
                  width="100"
                  align="right">
                  <template v-slot="{ row, column, $index }" id="row.budgetMode-1">
                    <template v-if="row.status !== -1">
                      <div v-if="row.budgetMode === 'BUDGET_MODE_INFINITE' || row.budget === null">不限</div>
                      <template v-else>
                        <i v-if="row.showBudget===0" class="el-icon-edit" @click="row.showBudget=1">{{
                            row.budget
                          }}</i>
                        <el-input v-focus v-else style="width: 100%;" v-model="row.budget" :ref="'cpBudget'+$index"
                                  type="text" size="mini" :disabled="row.status === 1||row.status === 2"
                                  oninput="if(isNaN(value)){value=null} if(value.indexOf(0) === 0 && value.charAt(1) !== '.'){value=0} if(value.indexOf('.')>0){value=value.slice(0,value.indexOf('.')+3)}"
                                  @blur="changeCampaignBudget(row)"
                        >
                        </el-input>
                        <div v-show="row.budgetMode === 'BUDGET_MODE_DAY' && row.ttCampaignId !== ''">日预算</div>
                        <div v-show="row.budgetMode === 'BUDGET_MODE_TOTAL' && row.ttCampaignId !== ''">总预算</div>
                      </template>
                    </template>
                  </template>
                </el-table-column>
                <el-table-column prop="createUser" label="创建者">
                  <template slot-scope="{row}">
                    {{ getCreatorName(row.createUser) }}
                  </template>
                </el-table-column>
                <el-table-column
                  v-for="item in tableColumnData"
                  v-show="!excludeCampaignTableCol.includes(item.value)"
                  :prop="item.value"
                  :label="item.label"
                  :width="item.width?item.width:''"
                  :fixed="item.fixed"
                  :render-header="item.renderHeader"
                  align="right"
                  min-width="120px"
                  :sortable="item.sortable"
                  :show-overflow-tooltip="item.overflow">
                  <template v-slot="{row}" v-if="item.value === 'accountName'">
                    <div style="cursor:pointer;" @click="openUrl(tiktokAccountUrl + row.platformId)">
                      {{ row.accountName }}
                    </div>
                  </template>
                  <!--                    <template v-else v-slot="{row}">-->
                  <!--                      {{getEventDataValue(row, item.value)}}-->
                  <!--                    </template>-->
                </el-table-column>
              </el-table>
              <el-dialog
                title="修改名称"
                :visible.sync="editCampaignDialog"
                id="el-dialog-1"
                :close-on-click-modal="false"
                :modal-append-to-body="false"
                :modal="false"
                width="300px">
                <el-form :model="editCampaigForm" ref="editCampaigForm" label-width="0px">
                  <el-form-item
                    prop="campaignName"
                    :rules="[{ required: true, message: '名称不能为空',trigger: 'blur'}]">
                    <el-input v-model="editCampaigForm.campaignName" style="width: 100%"></el-input>
                  </el-form-item>
                </el-form>
                <span slot="footer" class="dialog-footer" id="dialog-footer-2">
    <el-button @click="editCampaignDialog = false" id="clear-1">取 消</el-button>
    <el-button type="primary" @click="editCampaignName" v-loading="editNameBtnLoading" id="el-button-2">确 定</el-button>
  </span>
              </el-dialog>
              <!--复制推广系列-->

              <!--            <el-dialog-->
              <!--              title="复制推广系列"-->
              <!--              :visible.sync="copyCampaignDialog"-->
              <!--              :close-on-click-modal="false"-->
              <!--              :modal-append-to-body="false"-->
              <!--              width="600px">-->
              <!--              <el-form :model="copyCampaignForm" label-width="100px">-->
              <!--                <el-form-item label="推广目标">-->
              <!--                  <span>应用推广</span>-->
              <!--                </el-form-item>-->
              <!--                <el-form-item label="复制数量">-->
              <!--                  <el-input-number size="mini" v-model="copyCampaignForm.num" :disabled="true"></el-input-number>-->
              <!--                </el-form-item>-->
              <!--                &lt;!&ndash;<el-form-item label="广告账户">&ndash;&gt;-->
              <!--                &lt;!&ndash;  <el-select v-model="copyCampaignForm.platformId"&ndash;&gt;-->
              <!--                &lt;!&ndash;             @change="accountChanged"&ndash;&gt;-->
              <!--                &lt;!&ndash;             placeholder="请选择" size="mini">&ndash;&gt;-->
              <!--                &lt;!&ndash;    <el-option v-for="item in accountList" :key="item.value" :label="item.label+' ID:'+item.value"&ndash;&gt;-->
              <!--                &lt;!&ndash;               :value="item.value">&ndash;&gt;-->
              <!--                &lt;!&ndash;    </el-option>&ndash;&gt;-->
              <!--                &lt;!&ndash;  </el-select>&ndash;&gt;-->
              <!--                &lt;!&ndash;</el-form-item>&ndash;&gt;-->
              <!--                <el-form-item label="复制到">-->
              <!--                  <el-radio-group v-model="copyCampaignForm.isCreate">-->
              <!--                    <el-radio :label="true">新建推广系列</el-radio>-->
              <!--                    <el-radio :label="false" disabled>已有推广系列</el-radio>-->
              <!--                  </el-radio-group>-->
              <!--                </el-form-item>-->
              <!--                <el-collapse-transition>-->
              <!--                  <div v-show="copyCampaignForm.isCreate">-->
              <!--                    <el-form-item>-->
              <!--                      <el-input size="mini" v-model="copyCampaignForm.campaignName"></el-input>-->
              <!--                    </el-form-item>-->
              <!--                  </div>-->
              <!--                </el-collapse-transition>-->

              <!--              </el-form>-->
              <!--              <span slot="footer" class="dialog-footer">-->
              <!--  <el-button @click="copyCampaignDialog = false">取 消</el-button>-->
              <!--  <el-button type="primary" @click="copyCampaign">确 定</el-button>-->
              <!--</span>-->
              <!--            </el-dialog>-->
            </div>
            <div class="bottom-page clearfix" id="bottom-page-1 clearfix-1">
              <el-pagination
                background
                @size-change="handleCampaignSizeChange"
                @current-change="handleCampaignCurrentChange"
                :current-page="campaignPage.current"
                :page-sizes="[10, 20, 30, 40, 50, 100]"
                :page-size="campaignPage.size"
                layout="total, sizes, prev, pager, next, jumper"
                :total="campaignTotal">
              </el-pagination>
            </div>
          </div>
        </el-tab-pane>
        <el-tab-pane label="广告组" name="adGroup" id="adGroup-1">
          <span slot="label">
            广告组<el-tag style="float:right;margin-top: 5px" v-show="selectedAdGroups.length!==0" closable
                       @close="handleCloseCampaigns1()">已选{{ selectedAdGroups.length }}项</el-tag>
          </span>

          <div class="curd-table" id="curd-table-2">
            <div class="tab-header clearfix" id="tab-header clearfix-2">
              <div class="tab-header-left" id="tab-header-left-1">
                <el-button size="mini" type="primary" plain @click="createAdGroup">新建</el-button>
                <el-dropdown @command="handleBatchUpdateAdGroupCommand">
                  <el-button size="mini">
                    修改<i class="el-icon-arrow-down el-icon--right" id="el-icon-arrow-down el-icon--righ-1"></i>
                  </el-button>
                  <el-dropdown-menu slot="dropdown">
                    <el-dropdown-item command="handleBatchStartAdGroup" id="handleBatchStartAdGroup-2">开启
                    </el-dropdown-item>
                    <el-dropdown-item command="handleBatchStopAdGroup" id="handleBatchStopAdGroup-2">停止
                    </el-dropdown-item>
                    <el-dropdown-item command="handleBatchUpdateBudget" id="handleBatchUpdateBudget-2">修改预算
                    </el-dropdown-item>
                    <el-dropdown-item command="handleBatchUpdateAdGroupNames" id="handleBatchUpdateAdGroupNames-2">
                      修改名称
                    </el-dropdown-item>
                    <el-dropdown-item command="handleBatchUpdateAdGroupBids" id="handleBatchUpdateAdGroupBids-2">修改出价
                    </el-dropdown-item>
                    <el-dropdown-item v-show="false" command="handleBatchUpdateAdGroupTargeting"
                                      id="handleBatchUpdateAdGroupTargeting-2">修改定向
                    </el-dropdown-item>
                  </el-dropdown-menu>
                </el-dropdown>
                <el-button size="mini" type="warning" plain @click="copyMultipleAdGroup()">复制</el-button>
              </div>
              <div class="tab-header-right">
                <el-switch
                  v-model="statusVal"
                  :active-color="activeColor"
                  :inactive-color="inactiveColor"
                  active-text="显示创建失败"
                  inactive-text=""
                  @change="showStatusByFail"
                >
                </el-switch>
                <el-select size="mini" style="width: 150px;" v-model="adGroupAudience" placeholder="细分数据"
                           @change="getAdGroupAudiencesDataList">
                  <el-option
                    v-for="item in filterAudienceList"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                  </el-option>
                </el-select>
                <common-cpn :template-list="templateList" @custom-col="tableColumnDrawer=true" @default-col="()=>{
                  this.changeDefualtTemplate()
                  this.getDataByTab
              }" :template-val.sync="templateVal" @change-template="handleChangeTemplate"
                            @del-template="deleteTemplate"
                            @save-template="showTemplateDialog"></common-cpn>
                <!--<el-tooltip effect="dark" content="自定义列" placement="top">-->
                <!--  <el-button icon="el-icon-s-operation" size="mini" circle @click="tableColumnDrawer=true"></el-button>-->
                <!--</el-tooltip>-->
              </div>
            </div>
            <div class="table-body" id="ad-group-table">
              <!--广告组-->
              <el-table
                v-loading="adGroupLoading"
                element-loading-text="加载中"
                element-loading-spinner="el-icon-loading"
                element-loading-background="rgba(255, 255, 255, 0.5)"
                :data="adGroupTableData"
                border
                stripe
                ref="adGroupDataTable"
                :summary-method="getAdGroupSummaries"
                show-summary
                style="width: 100%"
                default-expand-all
                row-key="id"
                :tree-props="{children: 'children', hasChildren: 'hasChildren'}"
                :row-style="iRowStyle"
                :header-cell-style="iHeaderCellStyle"
                @sort-change="sortChange"
                @selection-change="handleAdGroupSelectionChange">
                <el-table-column
                  type="selection"
                  width="55"
                  :reserve-selection="true"
                  align="center">
                </el-table-column>
                <el-table-column
                  fixed="left"
                  label="开关">
                  <template v-slot="{row}">
                    <template v-if="row.status !== -1 && row.isSmartPerformanceCampaign  !== 1">
                      <!--<template v-if="row.status !== -1">-->
                      <el-switch
                        :value="row.operationStatus"
                        :active-color="activeColor"
                        :inactive-color="inactiveColor"
                        active-text=""
                        inactive-text=""
                        :active-value="'ENABLE'"
                        :inactive-value="'DISABLE'"
                        :disabled="row.ttAdgroupId === ''"
                        @change="changeAdGroupStatus(row)">
                      </el-switch>
                    </template>
                  </template>
                </el-table-column>
                <el-table-column
                  fixed="left"
                  prop="adgroupName"
                  label="广告组名"
                  width="300">
                  <template v-slot="{row}">
                    <template v-if="row.status !== -1 && row.isSmartPerformanceCampaign  !== 1">
                      <el-tooltip effect="dark" :content="row.adgroupName" placement="top" class="name-tip">
                        <div @mouseover="row.showOpt=1" @mouseleave="row.showOpt=0">
                          <div class="name-tip-content">
                            <i class="myicon icon-RO" v-show="row.adTypes.indexOf('RO') !== -1"></i>
                            <!--<i class="myicon icon-VEO" v-show="row.adTypes.indexOf('MAI') !== -1"></i>-->
                            <i class="myicon icon-ACO" v-show="row.creativeMaterialMode === 'DYNAMIC'"></i>
                            <i class="myicon icon-APPO" v-show="row.campaignAppProfilePageState === 'ON'"></i>
                            <i class="myicon icon-SPC" v-show="row.isSmartPerformanceCampaign === 1"></i>
                            <el-button type="text" class="over-flow-ellipsis main-tilte" @click="gotoAdTable(row)">
                              {{ row.adgroupName }}
                            </el-button>
                            <i
                              v-show="!(row.status ===1 || row.status === 3)"
                              class="el-icon-edit"
                              @click="showEditAdGroupName(row)"></i>
                          </div>
                          <el-collapse-transition>
                            <div v-show="row.showOpt" style="position: absolute">
                              <el-button v-show="row.ttAdgroupId !== ''" type="text" size="mini" icon="el-icon-share"
                                         @click="copyMultipleAdGroup(row)" id="el-icon-share"
                                         :disabled="copyBtnLoading">
                                复制
                              </el-button>
                              <el-button type="text" size="mini"
                                         icon="el-icon-edit" @click="handleEditSingleAdGroup(row)" id="el-update-box-1">
                                编辑
                              </el-button>
                            </div>
                          </el-collapse-transition>
                        </div>
                      </el-tooltip>
                      <el-tooltip v-if="row.reason !== ''" style="width: 12px" effect="dark"
                                  placement="right">
                        <div v-show="row.reason !== ' ' " slot="content">
                          {{ row.reason }}<br/>{{ '推广系列名称：' + row.campaignName }}
                        </div>
                        <i class="el-icon-warning warning"></i>
                      </el-tooltip>
                    </template>
                    <template v-else>
                      {{ row.adgroupName }}
                    </template>
                  </template>
                </el-table-column>
                <el-table-column
                  prop="ttAdgroupId"
                  label="广告组ID"
                  :show-overflow-tooltip='true'>
                </el-table-column>
                <el-table-column
                  prop="campaignName"
                  label="推广系列名称"
                  :show-overflow-tooltip='true'>
                </el-table-column>
                <el-table-column
                  prop="status"
                  label="状态">
                  <template v-slot="{row}">
                    <template v-if="row.status !== -1">
                      <div class="tiktok-status-display">
                        <div>
                          {{ formatterTtStatus(row.status, 'index', 'adGroup') }}
                        </div>
                        <span>
                        {{ formatterTtStatus(row.ttStatus, 'key', 'adGroup') }}
                      </span>
                      </div>
                    </template>
                  </template>
                </el-table-column>
                <!--                <el-table-column-->
                <!--                  label="诊断建议">-->
                <!--                </el-table-column>-->
                <el-table-column
                  label="预算USD"
                  align="right">
                  <template v-slot="{ row, column, $index }">
                    <template v-if="row.status !== -1& row.isSmartPerformanceCampaign !== 1">
                      <div v-if="row.budgetMode === 'BUDGET_MODE_INFINITE' || row.ttCampaignId === ''">不限</div>
                      <template v-else>
                        <i v-if="row.showBudget===0" class="el-icon-edit" @click="row.showBudget=1">{{
                            row.budget
                          }}</i>
                        <el-input v-focus v-else style="width: 100%;" v-model="row.budget"
                                  type="text" size="mini"
                                  oninput="if(isNaN(value)){value=null} if(value.indexOf(0) === 0 && value.charAt(1) !== '.'){value=0} if(value.indexOf('.')>0){value=value.slice(0,value.indexOf('.')+3)}"
                                  @blur="changeAdgroupBudget(row)">
                        </el-input>
                        <div v-show="row.budgetMode === 'BUDGET_MODE_DAY' && row.ttCampaignId !== ''">日预算</div>
                        <div v-show="row.budgetMode === 'BUDGET_MODE_TOTAL' && row.ttCampaignId !== ''">总预算</div>
                      </template>
                    </template>
                    <template v-else>
                      <div v-if="row.budgetMode === 'BUDGET_MODE_INFINITE' || row.ttCampaignId === ''">不限</div>
                      <template v-else>
                        <div>{{
                            row.budget
                          }}
                        </div>
                        <div v-show="row.budgetMode === 'BUDGET_MODE_DAY' && row.ttCampaignId !== ''">日预算</div>
                        <div v-show="row.budgetMode === 'BUDGET_MODE_TOTAL' && row.ttCampaignId !== ''">总预算</div>
                      </template>
                    </template>
                    <template v-else>
                      <div v-if="row.budgetMode === 'BUDGET_MODE_INFINITE' || row.ttCampaignId === ''">不限</div>
                      <template v-else>
                        <div>{{
                            row.budget
                          }}
                        </div>
                        <div v-show="row.budgetMode === 'BUDGET_MODE_DAY' && row.ttCampaignId !== ''">日预算</div>
                        <div v-show="row.budgetMode === 'BUDGET_MODE_TOTAL' && row.ttCampaignId !== ''">总预算</div>
                      </template>
                    </template>
                  </template>
                </el-table-column>
                <el-table-column
                  prop="bidPrice"
                  label="出价USD"
                  align="right">
                  <template v-slot="{row}">
                    <template v-if="row.status !== -1&& row.isSmartPerformanceCampaign !== 1">
                      <template v-if="row.optimizationGoal === 'CLICK'">
                        <i
                          v-show="row.ttAdgroupId !== '' && row.ttAdgroupId !== null && row.bidType !== 'BID_TYPE_NO_BID'"
                          v-if="row.showBids===0" class="el-icon-edit" @click="showAdgroupBidInput(row)">{{
                            row.bidPrice
                          }}</i>
                        <el-input v-else style="width: 100%;" v-model="row.bidPrice"
                                  type="text" size="mini"
                                  v-focus
                                  @blur="changeAdgroupBid(row)"
                                  oninput="if(isNaN(value)){value=null} if(value.indexOf(0) === 0 && value.charAt(1) !== '.'){value=0} if(value.indexOf('.')>0){value=value.slice(0,value.indexOf('.')+3)}"
                                  :disabled="row.ttAdgroupId === '' || row.ttAdgroupId === null || row.bidType === 'BID_TYPE_NO_BID'"
                        >
                        </el-input>
                      </template>
                      <template v-else>
                        <i
                          v-show="row.ttAdgroupId !== '' && row.ttAdgroupId !== null && row.bidType !== 'BID_TYPE_NO_BID'"
                          v-if="row.showBids===0" class="el-icon-edit"
                          @click="showAdgroupBidInput(row)">{{ row.conversionBidPrice }}</i>
                        <el-input v-else style="width: 100%;" v-model="row.conversionBidPrice"
                                  type="text" size="mini"
                                  v-focus
                                  @blur="changeAdgroupBid(row)"
                                  oninput="if(isNaN(value)){value=null} if(value.indexOf(0) === 0 && value.charAt(1) !== '.'){value=0} if(value.indexOf('.')>0){value=value.slice(0,value.indexOf('.')+3)}"
                                  :disabled="row.ttAdgroupId === '' || row.ttAdgroupId === null || row.bidType === 'BID_TYPE_NO_BID'"
                        >
                        </el-input>
                      </template>
                    </template>
                  </template>
                </el-table-column>
                <el-table-column
                  prop="scheduleStartTime"
                  label="投放时间"
                  :show-overflow-tooltip='true'
                  align="right">
                </el-table-column>
                <!--<el-table-column-->
                <!--  prop="reason"-->
                <!--  label="原因"-->
                <!--  :show-overflow-tooltip='true'-->
                <!--  align="right">-->
                <!--</el-table-column>-->
                <el-table-column prop="createUser" label="创建者">
                  <template slot-scope="{row}">
                    {{ getCreatorName(row.createUser) }}
                  </template>
                </el-table-column>
                <el-table-column
                  v-for="item in tableColumnData"
                  v-show="!excludeAdGroupTableCol.includes(item.value)"
                  :prop="item.value"
                  :label="item.label"
                  :width="item.width?item.width:''"
                  :fixed="item.fixed"
                  :render-header="item.renderHeader"
                  align="right"
                  min-width="120px"
                  :sortable="item.sortable"
                  :show-overflow-tooltip="item.overflow">
                  <template v-slot="{row}" v-if="item.value === 'accountName'">
                    <div style="cursor:pointer;" @click="openUrl(tiktokAccountUrl + row.platformId)">
                      {{ row.accountName }}
                    </div>
                  </template>
                  <!--                  <template v-else v-slot="{row}">-->
                  <!--                    {{getEventDataValue(row, item.value)}}-->
                  <!--                  </template>-->
                </el-table-column>
                <!--                <el-table-column-->
                <!--                  fixed="right"-->
                <!--                  label="操作">-->
                <!--                  <template v-slot="{row}">-->
                <!--                    <el-button type="text" size="mini" icon="el-icon-edit" @click="handleEditSingleAdGroup(row)">-->
                <!--                    </el-button>-->
                <!--                  </template>-->
                <!--                </el-table-column>-->
              </el-table>
              <el-dialog
                title="修改名称"
                :visible.sync="editAdGroupDialog"
                :close-on-click-modal="false"
                :modal-append-to-body="false"
                :modal="false"
                width="300px">
                <el-form :model="editAdGroupForm" ref="editAdGroupForm" label-width="0px">
                  <el-form-item
                    prop="groupName"
                    :rules="[{ required: true, message: '名称不能为空',trigger: 'blur'}]">
                    <el-input v-model="editAdGroupForm.groupName" style="width: 100%"></el-input>
                  </el-form-item>
                </el-form>
                <span slot="footer" class="dialog-footer" id="dialog-footer-3">
    <el-button @click="editAdGroupDialog = false">取 消</el-button>
    <el-button type="primary" @click="editAdGroupName" v-loading="editNameBtnLoading">确 定</el-button>
  </span>
              </el-dialog>
              <!--              修改广告系列预算-->

              <!--复制广告组-->
              <el-dialog
                :title="copyAdGroupFormIsAdd?'添加广告组':'复制广告组'"
                :visible.sync="copyAdGroupDialog"
                id="el-dialog-1"
                :close-on-click-modal="false"
                :modal-append-to-body="false"
                width="600px">
                <el-form :model="copyAdGroupForm" label-width="100px" ref="copyAdGroupForm">
                  <template v-if="copyAdGroupFormIsAdd===false">
                    <el-form-item label="推广目标">
                      <span>应用推广</span>
                    </el-form-item>
                    <el-form-item label="复制数量">
                      <el-input-number size="mini" v-model="copyAdGroupForm.num" :min="1"
                                       :disabled="disabledCreativeMaterialMode"></el-input-number>
                    </el-form-item>
                  </template>
                  <el-form-item label="复制到">
                    <el-radio-group v-model="copyAdGroupForm.isCreateCampaign">
                      <el-radio :label="true" :disabled="copyAdGroupFormIsAdd">新建推广系列</el-radio>
                      <el-radio :label="false">已有推广系列</el-radio>
                    </el-radio-group>
                  </el-form-item>
                  <el-form-item label="推广系列名称" v-if="copyAdGroupForm.isCreateCampaign">
                    <el-input size="mini" v-model="copyAdGroupForm.campaignName"></el-input>
                  </el-form-item>
                  <el-form-item v-else label="推广系列" prop="campaignId"
                                :rules="[{ required: true, message: '请选择推广系列',trigger: 'change'}]">
                    <el-select v-model="copyAdGroupForm.campaignId" filterable :disabled="copyBtnLoading"
                               v-loading="copyBtnLoading"
                               placeholder="请选择" size="mini" @change="handleChangeCampaignByAdGroup">
                      <el-option v-for="item in campaignList" :key="item.id" :label="item.campaignName"
                                 :value="item.id">
                        <span style="float: left">{{ item.campaignName }}</span>
                        <span v-if="copyAdGroupForm.clone.campaignId === item.id"
                              style="float: right; color: #8492a6; font-size: 13px">当前</span>
                      </el-option>
                    </el-select>
                  </el-form-item>
                </el-form>
                <span slot="footer" class="dialog-footer" id="dialog-footer-5">
    <el-button @click="copyAdGroupDialog = false">取 消</el-button>
    <el-button type="primary" @click="copyAdGroup" :disabled="copyBtnLoading">确 定</el-button>
  </span>
              </el-dialog>
            </div>
            <div class="bottom-page clearfix" id="bottom-page clearfix-4">
              <el-pagination
                background
                @size-change="handleAdGroupSizeChange"
                @current-change="handleAdGroupCurrentChange"
                :current-page="adGroupPage.current"
                :page-sizes="[10, 20, 30, 40, 50, 100]"
                :page-size="adGroupPage.size"
                layout="total, sizes, prev, pager, next, jumper"
                :total="adGroupTotal">
              </el-pagination>
            </div>
          </div>
        </el-tab-pane>
        <el-tab-pane label="广告" name="ad" id='ad-1'>
          <div class="curd-table">
            <div class="tab-header clearfix">
              <div class="tab-header-left">
                <el-button size="mini" type="primary" plain @click="createAdv" id="add-1">新建</el-button>
                <el-dropdown @command="handleBatchUpdateAdCommand">
                  <el-button size="mini" id="el-update-ad">
                    修改<i class="el-icon-arrow-down el-icon--right" id="el-icon-id"></i>
                  </el-button>
                  <el-dropdown-menu slot="dropdown" id="dropdown-ad">
                    <el-dropdown-item command="handleBatchStartAd" id="dropdown-handleBatchStartAd-1">开启
                    </el-dropdown-item>
                    <el-dropdown-item command="handleBatchStopAd" id="dropdown-handleBatchStopAd1-1">停止
                    </el-dropdown-item>
                    <!--                    <el-dropdown-item command="handleBatchUpdateAdNames" id='dropdown-handleBatchUpdateAdNames-1'>-->
                    <!--                      修改名称-->
                    <!--                    </el-dropdown-item>-->
                  </el-dropdown-menu>
                </el-dropdown>
                <el-button size="mini" type="warning" plain @click="copyMultipleAd">复制</el-button>
              </div>
              <div class="tab-header-right">
                <el-switch
                  v-model="statusVal"
                  :active-color="activeColor"
                  :inactive-color="inactiveColor"
                  active-text="显示创建失败"
                  inactive-text=""
                  @change="showStatusByFail"
                >
                </el-switch>
                <el-select size="mini" style="width: 150px;" v-model="adAudience" placeholder="细分数据"
                           @change="getAdAudiencesDataList">
                  <el-option
                    v-for="item in filterAudienceList"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                  </el-option>
                </el-select>
                <common-cpn :template-list="templateList" @custom-col="tableColumnDrawer=true" @default-col="()=>{
                  this.changeDefualtTemplate()
                  this.getDataByTab
              }" :template-val.sync="templateVal" @change-template="handleChangeTemplate"
                            @del-template="deleteTemplate"
                            @save-template="showTemplateDialog"></common-cpn>
                <!--<el-tooltip effect="dark" content="自定义列" placement="top">-->
                <!--  <el-button icon="el-icon-s-operation" size="mini" circle @click="tableColumnDrawer=true"></el-button>-->
                <!--</el-tooltip>-->
              </div>
            </div>
            <div class="table-body" id="ad-table">
              <el-table
                v-loading="adLoading"
                element-loading-text="加载中"
                element-loading-spinner="el-icon-loading"
                element-loading-background="rgba(255, 255, 255, 0.5)"
                :data="adTableData"
                border
                stripe
                default-expand-all
                row-key="id"
                ref="adDataTable"
                :summary-method="getAdSummaries"
                show-summary
                style="width: 100%"
                :tree-props="{children: 'children', hasChildren: 'hasChildren'}"
                :row-style="iRowStyle"
                :header-cell-style="iHeaderCellStyle"
                @sort-change="sortChange"
                @selection-change="handleAdSelectionChange">
                <el-table-column
                  :reserve-selection="true"
                  type="selection"
                  width="55"
                  align="center">
                </el-table-column>
                <el-table-column
                  fixed="left"
                  label="开关">
                  <template v-slot="{row}">
                    <template v-if="row.status !== -1 && row.isSmartPerformanceCampaign  !== 1">
                      <!--<template v-if="row.status !== -1">-->
                      <el-switch
                        v-if="row.adGroupId !== -1"
                        :value="row.operationStatus"
                        :active-color="activeColor"
                        :inactive-color="inactiveColor"
                        active-text=""
                        inactive-text=""
                        :active-value="'ENABLE'"
                        :inactive-value="'DISABLE'"
                        :disabled="row.ttAdId === ''"
                        @change="changeAdStatus(row)">
                      </el-switch>
                    </template>
                  </template>
                </el-table-column>
                <el-table-column
                  fixed="left"
                  prop="adName"
                  label="广告名"
                  width="300">
                  <template v-slot="{row}">
                    <template v-if="row.status !== -1 && row.isSmartPerformanceCampaign  !== 1">
                      <!--<template v-if="row.status !== -1">-->
                      <el-tooltip effect="dark" :content="row.adName" placement="top" class="name-tip">
                        <div v-if="row.status !== -1" @mouseover="row.isDeleted=1" @mouseleave="row.isDeleted=0">
                          <div class="name-tip-content">
                            <i class="myicon icon-RO" v-show="row.adTypes.indexOf('RO') !== -1"></i>
                            <!--<i class="myicon icon-VEO" v-show="row.adTypes.indexOf('MAI') !== -1"></i>-->
                            <i class="myicon icon-ACO" v-show="row.creativeMaterialMode === 'DYNAMIC'"></i>
                            <i class="myicon icon-APPO" v-show="row.campaignAppProfilePageState === 'ON'"></i>
                            <i class="myicon icon-SPC" v-show="row.isSmartPerformanceCampaign === 1"></i>
                            <div class="over-flow-ellipsis main-tilte">{{ row.adName }}</div>
                            <i style="padding-top: 5px" v-show="!(row.status ===1 || row.status === 3)"
                               class="el-icon-edit" @click="showEditAdName(row)"></i>
                          </div>
                          <el-collapse-transition>
                            <div v-show="row.isDeleted" style="position: absolute">
                              <el-button type="text"
                                         v-show="row.creativeMaterialMode !== 'DYNAMIC' || row.ttAdId !== ''"
                                         size="mini" icon="el-icon-share" @click="showCopyAdDialog(row)"
                                         :disabled="copyBtnLoading">复制
                              </el-button>
                              <el-button v-if="row.adGroupId !== -1" type="text" size="mini"
                                         icon="el-icon-edit" @click="handleEditAds(row)">编辑
                              </el-button>
                            </div>
                          </el-collapse-transition>
                        </div>
                      </el-tooltip>
                      <el-tooltip v-if="row.reason !== ''" style="width: 12px" effect="dark" :content="row.reason"
                                  placement="right">
                        <i class="el-icon-warning warning"></i>
                      </el-tooltip>
                    </template>
                    <template v-else class="over-flow-ellipsis">{{ row.adName }}</template>
                  </template>
                </el-table-column>
                <el-table-column
                  prop="status"
                  label="状态">
                  <template v-slot="{row}">
                    <template v-if="row.status !== -1">
                      <div class="tiktok-status-display">
                        <div>
                          {{ formatterTtStatus(row.status, 'index', 'ad') }}
                        </div>
                        <span>
                        {{ formatterTtStatus(row.ttStatus, 'key', 'ad') }}
                      </span>
                      </div>
                    </template>
                  </template>
                </el-table-column>
                <el-table-column
                  prop="ttAdId"
                  label="广告ID"
                  :show-overflow-tooltip='true'>
                </el-table-column>
                <el-table-column prop="createUser" label="创建者">
                  <template slot-scope="{row}">
                    {{ getCreatorName(row.createUser) }}
                  </template>
                </el-table-column>
                <el-table-column
                  v-for="item in tableColumnData"
                  v-show="!excludeAdTableCol.includes(item.value)"
                  :prop="item.value"
                  :label="item.label"
                  :width="item.width?item.width:''"
                  :fixed="item.fixed"
                  :render-header="item.renderHeader"
                  align="right"
                  min-width="120px"
                  :sortable="item.sortable"
                  :show-overflow-tooltip="item.overflow">
                  <template v-slot="{row}" v-if="item.label === '账户名'">
                    <div style="cursor:pointer;" @click="openUrl(tiktokAccountUrl + row.platformId)">
                      {{ row.accountName }}
                    </div>
                  </template>
                </el-table-column>
                <!--                <el-table-column-->
                <!--                  fixed="right"-->
                <!--                  label="操作">-->
                <!--                  <template v-slot="{row}">-->
                <!--                    <el-button v-if="row.adGroupId !== -1" type="text" size="mini" icon="el-icon-edit"-->
                <!--                               @click="handleEditAds(row)">-->
                <!--                    </el-button>-->
                <!--                  </template>-->
                <!--                </el-table-column>-->
              </el-table>
              <el-dialog
                title="修改名称"
                :visible.sync="editAdDialog"
                :close-on-click-modal="false"
                :modal-append-to-body="false"
                :modal="false"
                width="300px">
                <el-form :model="editAdForm" ref="editAdForm" label-width="0px">
                  <el-form-item
                    prop="adName"
                    :rules="[{ required: true, message: '名称不能为空',trigger: 'blur'}]">
                    <el-input v-model="editAdForm.adName" style="width: 100%"></el-input>
                  </el-form-item>
                </el-form>
                <span slot="footer" class="dialog-footer" id="dialog-footer-6">
    <el-button @click="editAdDialog = false">取 消</el-button>
    <el-button type="primary" @click="editAdName" v-loading="editNameBtnLoading">确 定</el-button>
  </span>
              </el-dialog>
              <!--复制广告-->
              <el-dialog
                :title="copyAdFormIsAdd?'添加广告':'复制广告'"
                :visible.sync="copyAdDialog"
                :close-on-click-modal="false"
                :modal-append-to-body="false"
                width="600px">
                <el-form :model="copyAdForm" label-width="100px" ref="copyAdForm">
                  <template v-if="copyAdFormIsAdd === false">
                    <el-form-item label="推广目标">
                      <span>应用推广</span>
                    </el-form-item>
                    <el-form-item label="复制数量">
                      <el-input-number size="mini" v-model="copyAdForm.num" :min="1" :max="20"></el-input-number>
                    </el-form-item>
                  </template>
                  <el-form-item label="复制到">
                    <el-radio-group v-model="copyAdForm.isCreateCampaign">
                      <el-radio :label="true" :disabled="copyAdFormIsAdd">新建推广系列</el-radio>
                      <el-radio :label="false">已有推广系列</el-radio>
                    </el-radio-group>
                  </el-form-item>
                  <el-form-item label="推广系列名称" v-if="copyAdForm.isCreateCampaign">
                    <el-input size="mini" v-model="copyAdForm.campaignName"></el-input>
                  </el-form-item>
                  <el-form-item v-else label="推广系列" prop="campaignId"
                                :rules="[{ required: true, message: '请选择推广系列',trigger: 'change'}]">
                    <el-select v-model="copyAdForm.campaignId"
                               placeholder="请选择" size="mini"
                               filterable
                               @change="handleChangeCampaignByAd" :disabled="copyBtnLoading" v-loading="copyBtnLoading">
                      <el-option v-for="item in campaignList" :key="item.id" :label="item.campaignName"
                                 :value="item.id">
                        <span style="float: left">{{ item.campaignName }}</span>
                        <span v-if="copyAdForm.clone.campaignId === item.id"
                              style="float: right; color: #8492a6; font-size: 13px">当前</span>
                      </el-option>
                    </el-select>
                  </el-form-item>
                  <template v-if="!copyAdForm.isCreateCampaign && copyAdForm.campaignId !== ''">
                    <el-form-item label="复制到">
                      <el-radio-group v-model="copyAdForm.isCreateAdGroup">
                        <el-radio :label="true" :disabled="copyAdFormIsAdd">新建广告组</el-radio>
                        <el-radio :label="false">已有广告组</el-radio>
                      </el-radio-group>
                    </el-form-item>
                    <el-form-item v-if="copyAdForm.isCreateAdGroup" label="广告组名称">
                      <el-input size="mini" v-model="copyAdForm.adGroupName"></el-input>
                    </el-form-item>
                    <el-form-item v-else label="广告组" prop="adGroupId"
                                  :rules="[{ required: true, message: '请选择广告组',trigger: 'change'}]">
                      <el-select v-model="copyAdForm.adGroupId" filterable
                                 placeholder="请选择" size="mini" @change="handleChangeAdGroupByAd">
                        <el-option v-for="item in adGroupList" :key="item.id" :label="item.adgroupName"
                                   :value="item.id" :disabled="item.creativeMaterialMode==='DYNAMIC'">
                          <span style="float: left">{{ item.adgroupName }}</span>
                          <span v-if="copyAdForm.clone.adGroupId === item.id"
                                style="float: right; color: #8492a6; font-size: 13px">当前</span>
                        </el-option>
                      </el-select>
                    </el-form-item>
                  </template>
                </el-form>
                <span slot="footer" class="dialog-footer" id="dialog-footer-7">
    <el-button @click="copyAdDialog = false">取 消</el-button>
    <el-button type="primary" @click="copyAd">确 定</el-button>
  </span>
              </el-dialog>
            </div>
            <div class="bottom-page clearfix" id="bottom-page clearfix-1">
              <el-pagination
                background
                @size-change="handleAdSizeChange"
                @current-change="handleAdCurrentChange"
                :current-page="adPage.current"
                :page-sizes="[10, 20, 30, 40, 50, 100]"
                :page-size="adPage.size"
                layout="total, sizes, prev, pager, next, jumper"
                :total="adTotal">
              </el-pagination>
            </div>
          </div>
        </el-tab-pane>
      </el-tabs>
      <campaign-clone ref="campaignClone" v-if="copyCampaignDialog" :visible.sync="copyCampaignDialog"
                      :options="copyCampaignOpt" :offer-id="offerId"></campaign-clone>
      <ad-group-clone ref="adGroupClone" v-if="copyMultipleAdGroupDialog" :visible.sync="copyMultipleAdGroupDialog"
                      :options="copyMultipleAdGroupOptions" :offer-id="offerId"
                      :copy-ad-group-list="copyAdGroupList"></ad-group-clone>
      <ad-clone ref="adGroupClone" v-if="copyMultipleAdDialog" :visible.sync="copyMultipleAdDialog"
                :options="copyMultipleAdOptions" :offer-id="offerId"
                :copy-ad-list="copyAdList"></ad-clone>
      <el-dialog
        title="添加自定义模板"
        id="templateDialog-1"
        :visible.sync="templateDialog"
        :close-on-click-modal="false"
        :modal-append-to-body="false"
        width="300px">
        <el-form :model="templateForm" ref="templateForm" label-width="0px">
          <el-form-item
            prop="name"
            :rules="[
                      { required: true, message: '模板名称不能为空',trigger: 'blur'},
                    ]"
          >
            <el-input v-model="templateForm.name" style="width: 100%" id="input-name-1"></el-input>
          </el-form-item>
        </el-form>
        <span slot="footer" class="dialog-footer" id="dialong-footer-span-1">
                    <el-button @click="templateDialog = false" id="el-button-sotp">取 消</el-button>
                    <el-button type="primary" @click="submitTemplate" v-loading="isTemplateLoading"
                               id="el-primary-click-1">确 定</el-button>
                  </span>
      </el-dialog>
      <el-drawer
        title="自定义列"
        size="800px"
        id="drawer-tableColumn-1"
        :visible.sync="tableColumnDrawer"
        :modal-append-to-body="false"
        :close-on-click-modal="false"
        :append-to-body="true"
        :wrapperClosable="false"
      >
        <el-divider></el-divider>
        <cs-drawer-container>
          <div class="drawer-box" id="drawer-box-2">
            <div class="drawer-box-left" id="drawer-box-left-2">
              <div class="drawer-box-left-input" id="drawer-box-left-input-2">
                <el-input v-model="headerQueryIntputLeft" size="mini" prefix-icon="el-icon-search-2"
                          placeholder="请输入搜索内容" clearable></el-input>
              </div>
              <div class="drawer-box-left-tab" id="drawer-box-left-tab-2">
                <el-tabs type="border-card">
                  <el-tab-pane label="基础指标" id="el-pane-2">
                    <el-checkbox style="margin-bottom: 5px" :indeterminate="isIndeterminate" v-model="checkAll"
                                 @change="handleCheckAllChange($event)">全选
                    </el-checkbox>
                    <el-checkbox-group v-model="checkedBaseTarget">
                      <el-checkbox class="event-checkbox" id="event-checkbox-2" v-for="item in baseSearchData"
                                   :label="item.value" :key="item.value"
                                   :disabled="item.disabled"
                                   @change="handleCheckedDimCol($event,item)">{{ item.label }}
                      </el-checkbox>
                    </el-checkbox-group>
                  </el-tab-pane>
                  <el-tab-pane label="应用内事件数据" id="el-tab-pane-2">
                    <el-checkbox :indeterminate="isIndeterminate1" v-model="checkAll1"
                                 @change="handleCheckAllChange1($event)">全选
                    </el-checkbox>
                    <el-checkbox-group v-model="checkAppEvent">
                      <el-checkbox class="event-checkbox" v-for="item in appEventSearchData"
                                   :label="item.value" :key="item.value"
                                   :disabled="item.disabled"
                                   @change="handleCheckedDimCol($event,item)">{{ item.label }}
                      </el-checkbox>
                    </el-checkbox-group>
                  </el-tab-pane>
                  <el-tab-pane label="归因数据">
                    <el-checkbox :indeterminate="isIndeterminate2" v-model="checkAll2"
                                 @change="handleCheckAllChange2($event)">全选
                    </el-checkbox>
                    <el-checkbox-group v-model="checkAttributionEvent">
                      <el-checkbox class="event-checkbox" v-for="item in attributionSearchData"
                                   :label="item.value" :key="item.value"
                                   :disabled="item.disabled"
                                   @change="handleCheckedDimCol($event,item)">{{ item.label }}
                      </el-checkbox>
                    </el-checkbox-group>
                  </el-tab-pane>
                  <el-tab-pane label="设置">
                    <el-checkbox :indeterminate="isIndeterminate3" v-model="checkAll3"
                                 @change="handleCheckAllChange3($event)">全选
                    </el-checkbox>
                    <el-checkbox-group v-model="checkSetting">
                      <el-checkbox class="event-checkbox" v-for="item in settingSearchData"
                                   :label="item.value" :key="item.value"
                                   :disabled="item.disabled"
                                   @change="handleCheckedDimCol($event,item)">{{ item.label }}
                      </el-checkbox>
                    </el-checkbox-group>
                  </el-tab-pane>
                </el-tabs>
              </div>
            </div>
            <div class="drawer-box-right" id="drawer-box-right-2">
              <!--                    <el-input v-model="headerQueryIntputRight" size="mini" prefix-icon="el-icon-search"-->
              <!--                              placeholder="请输入搜索内容" clearable></el-input>-->
              <div class="select-label" id="select-label-2">已选{{ tableHeaderOpt.length }}列</div>
              <draggable class="tableHeaderOpt" id="tableHeaderOpt-1" v-model="tableHeaderOpt"
                         chosenClass="chosen" forceFallback="true"
                         group="people"
                         filter=".forbid"
                         animation="100"
                         :move="onMove">
                <transition-group>
                  <div :class="isDisabled(item.value)?'drag-box forbid':'drag-box'"
                       v-for="item in tableHeaderOpt" :key="item.value">
                    <div class="drag-box-left" id="drag-box-left-1">
                      <i class="myicon icon-igw-l-menu-2"></i>
                      <span>{{ item.label }}</span>
                    </div>
                    <div class="drag-box-right" v-show="!isDisabled(item.value)"><i class="myicon icon-zhiding"
                                                                                    @click="upCheckedCol(item)"></i><i
                      class="myicon icon-cha" @click="removeCheckedCol(item)"></i>
                    </div>
                  </div>
                </transition-group>
              </draggable>
            </div>
          </div>
          <el-button slot="bottom" size="mini" type="primary" @click="createTableColumn" id="create-1"
                     v-loading="campaignLoading || adGroupLoading || adLoading">生成
          </el-button>
        </cs-drawer-container>
      </el-drawer>
    </basic-container>
    <div class="compaign-detail-wrapper" v-else-if="pageType === 2">
      <div class="compaign-detail-wrapper-left">
        <basic-container>
          <div class="compaign-left">
            <el-menu
              ref="menu"
              unique-opened
              class="el-menu-vertical-demo"
              @select="selectMenu"
            >
              <el-submenu index="1" v-show="opeType< 3">
                <template slot="title">
                  <span>推广系列</span>
                </template>
                <el-menu-item index="1-1">APP</el-menu-item>
                <el-menu-item index="1-2">推广目标</el-menu-item>
                <el-menu-item index="1-3">设置</el-menu-item>
              </el-submenu>
              <el-submenu index="2" v-show="opeType < 4">
                <template slot="title">
                  <span>广告组</span>
                </template>
                <el-menu-item index="2-1">广告组名称</el-menu-item>
                <el-menu-item index="2-2">版位</el-menu-item>
                <el-menu-item index="2-3">创意投放方式</el-menu-item>
                <el-menu-item index="2-4">定向</el-menu-item>
                <el-menu-item index="2-5">预算&排期</el-menu-item>
                <el-menu-item index="2-6">出价优化</el-menu-item>
              </el-submenu>
              <el-submenu index="3">
                <template slot="title">
                  <span>广告</span>
                </template>
                <!--<el-menu-item index="3-1">广告名称</el-menu-item>-->
                <el-menu-item index="3-2">广告发布者身份</el-menu-item>
                <el-menu-item index="3-3">创意素材</el-menu-item>
                <el-menu-item index="3-4">检测</el-menu-item>
              </el-submenu>
            </el-menu>
            <div style="margin-top:50px;" v-show="campaignStep ===3">
              <el-divider content-position="left"><span style="color:#34A9FF;">广告组信息</span></el-divider>
              <el-radio :disabled="campaignForm.sameCreativesForAdgroup" v-model="curEditAdgroup"
                        v-for="(item,index) in adGroupForm.groupList"
                        :key="index" :value="index"
                        :label="index">{{ item.adgroupName }}
              </el-radio>
              <el-divider></el-divider>
              <el-button v-show="!campaignForm.sameCreativesForAdgroup" size="mini" @click="sameAdsforGroup">
                当前配置应用到全部广告组
              </el-button>
            </div>
          </div>
        </basic-container>
      </div>
      <div class="compaign-detail-wrapper-right" id="compaign-detail-wrapper-right-box-2" v-show="campaignStep ===1">
        <div class="compagin-opt" id="compagin-opt">
          <el-button @click="backToIndex" class="w-btn">返回任务列表</el-button>
          <!--<el-button size="mini" type="info" @click="saveDraft">保存草稿</el-button>-->
          <el-button type="primary" @click="campaignGotoAdGroup" v-loading="nextStepLoading"
                     id="compaign-detail-2" class="w-btn">下一步
          </el-button>
        </div>
        <el-form label-position="top" label-width="80px" :model="campaignForm" :rules="campaignFormRules"
                 ref="campaignForm">
          <basic-container ref="1-1">
            <div slot="header" class="card-header">
              <div class="detail-top">
                <div>APP</div>
              </div>
            </div>
            <el-row>
              <el-col :span="12">
                <el-form-item label="" prop="appId" ref="campaign-appId">
                  <el-select style="width: 500px;"
                             v-model="campaignForm.appId" placeholder="请选择" size="large" @change="handleChangeApp"
                             :disabled="disabledAppSelect"
                             id="el-selectr-1">
                    <el-option v-for="item in appList" :key="item.platformAppId" :value="item.platformAppId"
                               :label="item.appName">
                      <span style="float: left">{{ item.appName }}</span>
                      <span style="float: right" v-if="item.os === 1">
                        <el-image
                          style="width: 20px; height: 20px;vertical-align: middle"
                          :src="androidImage"
                          fit="contain"></el-image>
                      </span>
                      <span style="float: right" v-else>
                       <el-image
                         style="width: 20px; height: 20px;vertical-align: middle"
                         :src="iosImage"
                         fit="contain"></el-image>
                      </span>
                    </el-option>
                    <div slot="prefix" style="line-height: 34px;">
                      <el-image
                        style="width: 20px; height: 20px;vertical-align: middle"
                        :src="appIconUrl()"
                        fit="contain"></el-image>
                    </div>
                  </el-select>
                  <el-button @click="getAppList2(true)" style="margin-left:10px" icon="el-icon-refresh"
                             :loading="appLoading">刷新
                  </el-button>
                  <div style="position: absolute">
                    <el-alert
                      style="height: 36px;margin-top: 5px;width: 500px"
                      title="如果找不到该订单下的App，请点击列表右边的刷新按钮重试。"
                      type="info"
                      show-icon
                      :closable="false">
                    </el-alert>
                  </div>
                </el-form-item>
                <el-form-item>
                </el-form-item>
              </el-col>
              <el-col :span="12" v-if="campaignForm.ios14Camppaign">
                <div style="font-size: 14px;">您当前可以创建 {{ levelQuota.campaignQuota.availableQuota }} 个iOS 14专属推广系列</div>
                <!--<div style="font-size: 14px;">  {{levelQuota.campaignQuota.releasingQuota}} /  {{levelQuota.campaignQuota.totalQuota}} 额度已经被使用。发布广告后，您的额度将实时更新</div>-->
                <div style="font-size: 14px;"> 待释放 {{ levelQuota.campaignQuota.releasingQuota }}个，
                  已被使用 {{ levelQuota.campaignQuota.usedQuota }} 个。发布广告后，您的额度将实时更新。
                </div>
              </el-col>
            </el-row>
          </basic-container>
          <basic-container>
            <div slot="header" class="card-header" id="card-header-1">
              <div class="detail-top">
                <div>广告账户</div>
                <div class="container-title-tips">选择您需要创建广告的账户</div>
              </div>
              <!--<el-button type="text" icon="el-icon-close" @click="pageType = 1"></el-button>-->
            </div>
            <div class="compaign-right" id="compaign-right-4">
              <el-row>
                <el-col :span="16">
                  <el-form-item label="" prop="platformId" ref="campaign-platformId">
                    <el-select style="width: 500px;"
                               v-loading="selectAccountLoading"
                               :disabled="selectAccountLoading"
                               v-model="campaignForm.platformId"
                               @change="accountChanged"
                               placeholder="请选择" size="large" filterable>
                      <el-option v-for="item in accountList" :key="item.platformId"
                                 :label="item.accountName+' ID:'+item.platformId"
                                 :value="item.platformId">
                      </el-option>
                    </el-select>
                  </el-form-item>
                </el-col>

              </el-row>
              <el-row>
                <el-col :span="8">
                  <el-form-item label="">
                    <el-switch
                      v-model="campaignForm.ios14Camppaign"
                      :active-color="activeColor"
                      :inactive-color="inactiveColor"
                      id="campaignForm-ios14-1"
                      active-text="使用 iOS 14 专属推广系列"
                      inactive-text=""
                      :disabled="campaignForm.os!==2||campaignForm.platformId === ''"
                      @change="handleChangeIos14Switch"
                    >
                    </el-switch>
                  </el-form-item>
                </el-col>
                <el-col v-if="campaignForm.ios14Camppaign">
                  <el-switch
                    v-model="campaignForm.campaignAppProfilePageState"
                    :active-color="activeColor"
                    :inactive-color="inactiveColor"
                    active-text="使用应用介绍页优化投放"
                    inactive-text=""
                    active-value="ON"
                    inactive-value="OFF"
                    @change="handleChangeAppo"
                  >
                  </el-switch>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="12">
                  <div style="float:right;font-size: 14px;font-weight: 500; margin-top: -20px; margin-right: 30px">
                    <span>账户余额(USD): </span><span>{{
                      accountBalance ? accountBalance : '0.0'
                    }} </span>
                    <el-button v-show="campaignForm.platformId !== ''" type="text"
                               icon="el-icon-refresh-right"
                               v-loading="balanceBtnLoading"
                               @click="getAccountBalance"></el-button>
                  </div>
                </el-col>
              </el-row>
            </div>
          </basic-container>
          <basic-container id="sic-container-">
            <el-col :span="12">
              <basic-container ref="1-2">
                <div slot="header" class="card-header">
                  <div class="detail-top">
                    <div>推广目标</div>
                  </div>
                </div>
                <el-form-item label="">
                  <div class="promotion-target-card"
                       :class="{'current-promotion':campaignForm.objectiveType==='APP_INSTALL'}"
                       @click="campaignForm.objectiveType='APP_INSTALL'">
                    <div class="promotion-target-card-title">
                      <i class="el-icon-mobile-phone">应用推广</i>
                    </div>
                    <div class="promotion-target-card-content">
                      让更多用户安装并使用您的应用。
                    </div>
                  </div>
                </el-form-item>
              </basic-container>
            </el-col>
            <el-col :span="12">
              <basic-container>
                <div slot="header" class="card-header" id="card-header-1">
                  <div class="detail-top">
                    <div>推广系列类型</div>
                  </div>
                </div>
                <el-form-item label="">
                  <div>
                    <el-radio v-model="campaignForm.campaignType" :label="'REGULAR_CAMPAIGN'">应用推广</el-radio>
                    <div class="row-tips">
                      让新用户安装您的应用
                    </div>
                  </div>
                  <div>
                    <el-radio v-model="campaignForm.campaignType" :label="'temp'" disabled>应用再营销</el-radio>
                  </div>
                  <div class="row-tips">
                    重新吸引现有用户在您的应用中执行操作。iOS 14.5+ 设备不支持应用再营销。
                  </div>
                </el-form-item>
              </basic-container>
            </el-col>
          </basic-container>
          <basic-container ref="1-3" id="card-header-1">
            <div slot="header" class="card-header" id="el-card-header">
              <div class="detail-top">
                <div>设置</div>
              </div>
            </div>
            <el-form-item label="推广系列名称" prop="campaignName" id="campaignName-1">
              <el-input size="mini" v-model="campaignForm.campaignName" placeholder="请输入内容"></el-input>
            </el-form-item>
            <el-form-item label="">
              <el-switch
                v-model="campaignForm.comparison"
                :active-color="activeColor"
                :inactive-color="inactiveColor"
                active-text="创建拆分对比测试"
                inactive-text=""
                disabled>
              </el-switch>
              <div class="row-tips"></div>
            </el-form-item>
            <el-form-item label="">
              <el-switch
                v-model="campaignForm.budgetOptimizeSwitch"
                :active-color="activeColor"
                :inactive-color="inactiveColor"
                active-text="推广系列预算优化"
                inactive-text=""
                :active-value="1"
                :inactive-value="0"
                disabled
                @change="handleBudgetOptimizeSwitch">
              </el-switch>
              <div class="row-tips">系统自动优化预算分配，广告组不可在设置预算</div>
            </el-form-item>
            <el-form-item label="">
              <el-switch
                v-model="campaignForm.budgetSwitch"
                :active-color="activeColor"
                :inactive-color="inactiveColor"
                active-text="设置推广系列预算"
                id="campaign"
                inactive-text=""
                @change="handleBudgetSwitch">
              </el-switch>
              <div class="row-tips">系统自动优化预算分配，广告组不可在设置预算</div>
            </el-form-item>
            <el-collapse-transition>
              <div v-show="campaignForm.budgetOptimizeSwitch === 1||campaignForm.budgetSwitch">
                <el-form-item label="预算" prop="budget" ref="campaign-budget" id="campaign-budget">
                  <el-input placeholder="50.00以上" size="mini" v-model="campaignForm.budget" class="input-with-select"
                            id="input-with-select"
                            oninput="if(isNaN(value)){value=null} if(value.indexOf(0) === 0 && value.charAt(1) !== '.'){value=0} if(value.indexOf('.')>0){value=value.slice(0,value.indexOf('.')+3)}">
                    <el-select style="width: 100px" v-model="campaignForm.budgetMode" slot="prepend" placeholder="请选择"
                               @change="handleCampaignBudgetChange">
                      <el-option v-for="item in budgetModeList" :key="item.value" :label="item.label"
                                 :value="item.value"></el-option>
                    </el-select>
                    <template slot="append">USD</template>
                  </el-input>
                </el-form-item>
              </div>
            </el-collapse-transition>
            <el-collapse-transition id="row-tip-1">
              <div v-show="campaignForm.budgetOptimizeSwitch === 1">
                <el-form-item label="竞价策略">
                  <div class="row-tips">最低成本</div>
                </el-form-item>
                <el-form-item label="投放速度">
                  <div class="row-tips">标准</div>
                </el-form-item>
              </div>
            </el-collapse-transition>
          </basic-container>
        </el-form>
      </div>
      <div class="compaign-detail-wrapper-right" id="compaign-detail-wrapper-right-box1" v-show="campaignStep ===2">
        <div class="compagin-opt" id="compagin-opt-box-2">
          <el-button @click="backToIndex" class="w-btn">返回任务列表</el-button>
          <!--<el-button size="mini" type="info" @click="saveDraft">保存草稿</el-button>-->
          <el-button v-show="opeType < 2" type="primary" @click="campaignStep=1" id="el-go-2" class="w-btn">上一步
          </el-button>
          <el-button type="primary" @click="adGroupGotoAd" v-loading="nextStepLoading" id="el-adGroup-2" class="w-btn">
            下一步
          </el-button>
        </div>
        <div class="compagin-layout" id="pagin-layout-2">
          <div class="compagin-layout-left" id="layout-left">
            <el-form label-position="top" label-width="80px" :model="adGroupForm" :rules="adGroupFormRules"
                     ref="adGroupForm">
              <basic-container ref="2-1">
                <div slot="header" class="card-header">
                  <div class="detail-top">
                    <div>广告组名称</div>
                  </div>
                </div>
                <el-row>
                  <el-col :span="12">
                    <el-form-item label="" prop="adgroupName" ref="adGroup-adgroupName">
                      <el-input v-model="adGroupForm.adgroupName" placeholder="请输入内容"
                                @blur="createRenderAdGroup"></el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="12" v-if="campaignForm.ios14Camppaign">
                    <div slot="header" class="card-header">
                      <div class="detail-top">
                        <div>广告组额度</div>
                      </div>
                    </div>
                    <span>{{ levelQuota.adgroupQuota.usedQuota }} / {{ levelQuota.adgroupQuota.totalQuota }}   额度已经被使用，发布广告后您的额度将实时更新。</span>
                  </el-col>
                </el-row>
              </basic-container>

              <basic-container ref="2-2">
                <div slot="header" class="card-header">
                  <div class="detail-top">
                    <div>版位</div>
                  </div>
                </div>
                <el-form-item>
                  <div>
                    <el-radio v-model="adGroupForm.placementType" :label="'PLACEMENT_TYPE_AUTOMATIC'"
                              @change="handleChangePlacementType" id="adGroupForm.pltype-1">自动版位
                    </el-radio>
                    <div class="row-tips">
                      让新用户安装您的应用
                    </div>
                  </div>
                  <div>
                    <el-radio v-model="adGroupForm.placementType" :label="'PLACEMENT_TYPE_NORMAL'"
                              @change="handleChangePlacementType"
                              id="PlacementType-1">编辑版位
                    </el-radio>
                  </div>
                  <div class="row-tips">
                    重新吸引现有用户在您的应用中执行操作。iOS 14.5+ 设备不支持应用再营销。
                  </div>
                </el-form-item>
                <el-form-item prop="placement" ref="adGroup-placement">
                  <el-collapse-transition>
                    <div v-show="adGroupForm.placementType ==='PLACEMENT_TYPE_NORMAL'">
                      <el-checkbox-group v-model="adGroupForm.placement"
                                         @change="handleChangePlacement">
                        <el-checkbox v-for="item in placementsList" :label="item.value" :key="item.value">{{
                            item.label
                          }}
                        </el-checkbox>
                      </el-checkbox-group>
                    </div>
                  </el-collapse-transition>
                </el-form-item>
                <template
                  v-if="adGroupForm.placementType ==='PLACEMENT_TYPE_AUTOMATIC'||adGroupForm.placement.includes('PLACEMENT_TIKTOK')">
                  <el-form-item label="">
                    <el-switch
                      v-model="adGroupForm.commentDisabled"
                      :active-color="activeColor"
                      :inactive-color="inactiveColor"
                      active-text="用户评论"
                      inactive-text=""
                      :active-value="1"
                      :inactive-value="0">
                    </el-switch>
                    <div class="row-tips">系统自动优化预算分配</div>
                  </el-form-item>
                  <el-form-item label="">
                    <el-switch
                      v-model="adGroupForm.videoDownloadDisabled"
                      :active-color="activeColor"
                      :inactive-color="inactiveColor"
                      active-text="视频下载"
                      inactive-text=""
                      :active-value="1"
                      :inactive-value="0">
                    </el-switch>
                    <div class="row-tips">系统自动优化预算分配</div>
                  </el-form-item>
                  <el-form-item label="">
                    <el-switch
                      v-model="adGroupForm.shareDisabled"
                      :active-color="activeColor"
                      :inactive-color="inactiveColor"
                      active-text="视频共享"
                      inactive-text=""
                      :active-value="1"
                      :inactive-value="0">
                    </el-switch>
                  </el-form-item>
                </template>
                <template
                  v-if="adGroupForm.placementType ==='PLACEMENT_TYPE_AUTOMATIC'||adGroupForm.placement.includes('PLACEMENT_PANGLE')">
                  <el-form-item label="">
                    <el-switch
                      v-model="adGroupForm.blockedPangleDisabled"
                      :active-color="activeColor"
                      :inactive-color="inactiveColor"
                      active-text="Pangle 媒体屏蔽列表"
                      inactive-text=""
                      :active-value="1"
                      :inactive-value="0"
                      disabled>
                    </el-switch>
                    <div class="row-tips">Pangle 媒体屏蔽列表</div>
                  </el-form-item>
                </template>
              </basic-container>
              <basic-container ref="2-3">
                <div slot="header" class="card-header">
                  <div class="detail-top">
                    <div>创意投放方式</div>
                  </div>
                </div>
                <el-form-item label="">
                  <el-switch
                    v-model="adGroupForm.creativeMaterialMode"
                    :active-color="activeColor"
                    id="adGroupFormAco-1"
                    :inactive-color="inactiveColor"
                    active-text="程序化创意"
                    inactive-text=""
                    active-value="DYNAMIC"
                    inactive-value="CUSTOM"
                    :disabled="disabledCreativeMaterialMode"
                    @change="handleCreativeMaterialMode">
                  </el-switch>
                  <div class="row-tips">创建多个创意素材资产组合，包括视频和广告文案。 广告投放期间将自动向您的受众展示可以达到最理想效果的组合。 查看详情</div>
                </el-form-item>
              </basic-container>
              <basic-container v-show="adGroupForm.creativeMaterialMode ==='CUSTOM'">
                <!--<el-form-item label="">-->
                <!--  <el-switch-->
                <!--    v-model="adGroupForm.batch"-->
                <!--    :active-color="activeColor"-->
                <!--    :inactive-color="inactiveColor"-->
                <!--    active-text="批量创建"-->
                <!--    inactive-text=""-->
                <!--    @change="createRenderAdGroup">-->
                <!--  </el-switch>-->
                <!--  <div class="row-tips">系统会规则规则自动创建多个的广告组</div>-->
                <!--</el-form-item>-->
                <el-collapse-transition>
                  <div v-show="adGroupForm.batch">
                    <el-form-item label="">
                      <el-row>
                        <el-col :span="12">
                          <el-radio v-model="adGroupForm.autoCreateType" :label="1" @change="createRenderAdGroup">对应
                          </el-radio>
                          <div class="row-tips" id="row-tips-2">
                            单地区，多语言，单性别，单年龄创建广告组
                          </div>
                        </el-col>
                        <el-col :span="12">
                          <el-radio v-model="adGroupForm.autoCreateType" :label="2" @change="createRenderAdGroup">组合
                          </el-radio>
                          <div class="row-tips" id="row-tipss-1">
                            多地区，多语言，多性别，多年龄组合创建广告组
                          </div>
                        </el-col>
                      </el-row>
                    </el-form-item>
                  </div>
                </el-collapse-transition>
              </basic-container>
              <basic-container ref="2-4">
                <div slot="header" class="card-header" id="card-header-2">
                  <div class="detail-top">
                    <div>定向</div>
                  </div>
                </div>
                <el-form-item label="">
                  <div class="promotion-target-card" :class="{'current-promotion':adGroupForm.autoTargetingEnabled===0}"
                       @click="adGroupForm.autoTargetingEnabled=0">
                    <div class="promotion-target-card-title">
                      <b>自定义定向</b>
                    </div>
                    <div class="promotion-target-card-content">
                      手动设置关于要向哪类用户显示广告的条件。
                    </div>
                  </div>
                  <div class="promotion-target-card" :class="{'current-promotion':adGroupForm.autoTargetingEnabled===1}"
                       style="cursor: default">
                    <div class="promotion-target-card-title">
                      <b>自动定向</b>
                    </div>
                    <div class="promotion-target-card-content">
                      根据推广目标、广告内容和过去的推广数据优化定向。
                    </div>
                  </div>
                </el-form-item>
                <div>
                  <template v-if="adGroupForm.batch">
                    <!--批量创建广告组-->
                    <template v-if="adGroupForm.autoCreateType === 1">
                      <el-form-item label-width="0" prop="groupList" ref="adGroup-groupList">
                        <el-table
                          :data="adGroupForm.groupList"
                          style="width: 100%;margin-bottom: 15px">
                          <el-table-column
                            type="index">
                          </el-table-column>
                          <el-table-column
                            label="投放国家">
                            <template v-slot="{row}">
                              <el-select v-model="row.locationIds" placeholder="请选择" size="mini" multiple
                                         style="width: 100%"
                                         collapse-tags
                                         id="careate-select-1"
                                         @change="createRenderAdGroup()" filterable>
                                <el-checkbox v-model="checkOptions.checkAll" :style="{paddingLeft:'20px'}"
                                             :indeterminate="checkOptions.isIndeterminate"
                                             @change="selectAll(row.locationIds,$event)">
                                  全选
                                </el-checkbox>
                                <el-option
                                  v-for="item in locationList"
                                  :key="item.value"
                                  :label="item.label"
                                  :value="item.value">
                                </el-option>
                              </el-select>
                            </template>
                          </el-table-column>
                          <el-table-column
                            label="语言">
                            <template v-slot="{row}">
                              <el-select v-model="row.languages" placeholder="不限" size="mini" multiple
                                         style="width: 100%"
                                         @change="createRenderAdGroup" filterable
                                         id="languages-2"
                              >
                                <el-option v-for="item in languagesList"
                                           :key="item.value"
                                           :label="item.label"
                                           :value="item.value">
                                </el-option>
                              </el-select>
                            </template>
                          </el-table-column>
                          <el-table-column
                            label="性别">
                            <template v-slot="{row}">
                              <el-select v-model="row.gender" placeholder="请选择" size="mini" style="width: 100%"
                                         @change="createRenderAdGroup" id="el-gender-1">
                                <el-option v-for="item in genderList"
                                           :key="item.value"
                                           :label="item.label"
                                           :value="item.value">
                                </el-option>
                              </el-select>
                            </template>
                          </el-table-column>
                          <el-table-column
                            label="年龄">
                            <template v-slot="{row}">
                              <el-select v-model="row.age" placeholder="不限" size="mini" style="width: 100%" multiple
                                         @change="createRenderAdGroup" id="el-age-1">
                                <el-option v-for="item in ageGroupsList"
                                           :key="item.value"
                                           :label="item.label"
                                           :value="item.value">
                                </el-option>
                              </el-select>
                            </template>
                          </el-table-column>
                          <el-table-column
                            label="操作">
                            <template v-slot="{ $index }">
                              <el-button v-show="$index !== 0" type="text" icon="el-icon-delete"
                                         @click="removeAdGroup($index)"></el-button>
                            </template>
                          </el-table-column>
                        </el-table>
                      </el-form-item>
                      <el-button size="mini" round
                                 icon="el-icon-plus" @click="addSameGroupList">
                        同上
                      </el-button>
                      <el-button size="mini" type="primary" round
                                 icon="el-icon-plus" @click="adGroupForm.groupList.push(
                      { adgroupName: '',locationIds: [],languages: [],gender: 'GENDER_UNLIMITED',age: []})">
                        添加广告组
                      </el-button>
                      <span style="margin-left: 20px">
                        <el-checkbox v-model="campaignForm.sameCreativesForAdgroup">广告组使用相同素材及文案</el-checkbox>
                      </span>
                    </template>
                    <template v-else>
                      <!--组合-->
                      <el-form-item label="投放地区" prop="locationIdsArr" ref="adGroup-locationIdsArr">
                        <template v-for="(item,index) in adGroupForm.locationIdsArr">
                          <div :key="index">
                            <el-select v-model="adGroupForm.locationIdsArr[index]" placeholder="请选择" size="mini"
                                       id="createRend-1"
                                       multiple
                                       @change="createRenderAdGroup" filterable>
                              <el-option
                                v-for="item in locationList"
                                :key="item.value"
                                :label="item.label"
                                :value="item.value">
                              </el-option>
                            </el-select>
                            <el-button v-if="index === 0" size="mini" type="text" icon="el-icon-plus"
                                       @click="adGroupForm.locationIdsArr.push([]);"
                                       style="margin-left: 10px"></el-button>
                            <el-button v-else size="mini" type="text" icon="el-icon-minus"
                                       @click="()=>{adGroupForm.locationIdsArr.splice(index,1);createRenderAdGroup()}"
                                       style="margin-left: 10px"></el-button>
                          </div>
                        </template>
                      </el-form-item>
                      <el-form-item label="语言">
                        <template v-for="(item,index) in adGroupForm.languagesArr">
                          <div :key="index">
                            <el-select v-model="adGroupForm.languagesArr[index]" placeholder="不限" size="mini" multiple
                                       @change="createRenderAdGroup" filterable>
                              <el-option v-for="item in languagesList"
                                         :key="item.value"
                                         :label="item.label"
                                         :value="item.value">
                              </el-option>
                            </el-select>
                            <el-button v-if="index === 0" size="mini" type="text" icon="el-icon-plus"
                                       @click="adGroupForm.languagesArr.push([]);createRenderAdGroup()"
                                       style="margin-left: 10px"></el-button>
                            <el-button v-else size="mini" type="text" icon="el-icon-minus"
                                       @click="()=>{adGroupForm.languagesArr.splice(index,1);createRenderAdGroup()}"
                                       style="margin-left: 10px"></el-button>
                          </div>
                        </template>
                      </el-form-item>
                      <el-form-item label="性别">
                        <template v-for="(item,index) in adGroupForm.genderArr">
                          <div :key="index">
                            <el-radio-group v-model="adGroupForm.genderArr[index]" size="mini"
                                            @change="createRenderAdGroup">
                              <el-radio-button v-for="item in genderList" :key="item.value" :label="item.value">{{
                                  item.label
                                }}
                              </el-radio-button>
                            </el-radio-group>
                            <el-button v-if="index === 0" size="mini" type="text" icon="el-icon-plus"
                                       @click="adGroupForm.genderArr.push('GENDER_UNLIMITED');createRenderAdGroup()"
                                       style="margin-left: 10px"></el-button>
                            <el-button v-else size="mini" type="text" icon="el-icon-minus"
                                       @click="()=>{adGroupForm.genderArr.splice(index,1);createRenderAdGroup()}"
                                       style="margin-left: 10px"></el-button>
                          </div>
                        </template>
                      </el-form-item>
                      <el-form-item label="年龄">
                        <template v-for="(item,index) in adGroupForm.ageArr">
                          <div :key="index">
                            <!--<el-select v-model="adGroupForm.ageArr[index]" placeholder="不限" size="mini" multiple-->
                            <!--           @change="createRenderAdGroup">-->
                            <!--  <el-option v-for="item in ageGroupsList"-->
                            <!--             :key="item.value"-->
                            <!--             :label="item.label"-->
                            <!--             :value="item.value">-->
                            <!--  </el-option>-->
                            <!--</el-select>-->
                            <cs-radio-checkbox v-model="adGroupForm.ageArr[index]" :props="ageGroupsList"
                                               @change="createRenderAdGroup"></cs-radio-checkbox>
                            <!--<el-checkbox-group v-model="adGroupForm.ageArr[index]" size="mini" style="display: inline-block"-->
                            <!--                   @change="createRenderAdGroup">-->
                            <!--  <el-checkbox-button v-for="item in ageGroupsList"-->
                            <!--                      :key="item.value"-->
                            <!--                      :label="item.value">{{ item.label }}-->
                            <!--  </el-checkbox-button>-->
                            <!--</el-checkbox-group>-->
                            <el-button v-if="index === 0" size="mini" type="text" icon="el-icon-plus"
                                       @click="adGroupForm.ageArr.push([]);createRenderAdGroup()"
                                       style="margin-left: 10px"></el-button>
                            <el-button v-else size="mini" type="text" icon="el-icon-minus"
                                       @click="()=>{adGroupForm.ageArr.splice(index,1);createRenderAdGroup()}"
                                       style="margin-left: 10px"></el-button>
                          </div>
                        </template>
                      </el-form-item>
                    </template>
                  </template>
                  <template v-else id="createRenderAd">
                    <el-form-item label="投放地区">
                      <el-select v-model="adGroupForm.locationIds" placeholder="请选择" size="mini" multiple filterable
                                 @change="createRenderAdGroup">
                        <el-option
                          v-for="item in locationList"
                          :key="item.value"
                          :label="item.label"
                          :value="item.value">
                        </el-option>
                      </el-select>
                    </el-form-item>
                    <el-form-item label="语言">
                      <el-select v-model="adGroupForm.languages" placeholder="不限" size="mini" multiple filterable
                                 clearable
                                 @change="createRenderAdGroup">
                        <el-option v-for="item in languagesList"
                                   :key="item.value"
                                   :label="item.label"
                                   :value="item.value">
                        </el-option>
                      </el-select>
                    </el-form-item>
                    <el-form-item label="性别">
                      <el-radio-group v-model="adGroupForm.gender" size="mini" @change="createRenderAdGroup">
                        <el-radio-button v-for="item in genderList" :key="item.value" :label="item.value">{{
                            item.label
                          }}
                        </el-radio-button>
                      </el-radio-group>
                    </el-form-item>
                    <el-form-item label="年龄">
                      <cs-radio-checkbox v-model="adGroupForm.age" :props="ageGroupsList"
                                         @change="createRenderAdGroup"></cs-radio-checkbox>
                    </el-form-item>
                  </template>
                </div>
                <el-form-item label="家庭收入"
                              v-if="adGroupForm.placementType ==='PLACEMENT_TYPE_AUTOMATIC'||adGroupForm.placement.includes('PLACEMENT_TIKTOK')">
                  <el-select v-model="adGroupForm.householdIncome" placeholder="不限" size="mini" multiple clearable>
                    <el-option
                      v-for="item in householdIncomeList"
                      :key="item.value"
                      :label="item.label"
                      :value="item.value">
                    </el-option>
                  </el-select>
                </el-form-item>
                <el-form-item label="受众">
                  <el-cascader
                    size="mini"
                    v-model="adGroupForm.audience"
                    :options="audiencesList"
                    :props="audiencesCascaderProp"
                    clearable
                    filterable
                    ref="adGroupFormAudienceIds"
                    @change="handleChangeAdGroupFormAudienceIds"
                  ></el-cascader>
                  <el-tooltip effect="dark" content="点击刷新，可同步该账户里的可用受众包" placement="top-start">
                    <el-button style="margin-left: 5px" type="text" icon="el-icon-refresh-right"
                               @click="getAudiencesList(true)" v-loading="audiencesBtnLoading"></el-button>
                  </el-tooltip>
                </el-form-item>
                <el-form-item label="排除受众">
                  <el-cascader
                    v-model="adGroupForm.excludedAudience"
                    size="mini"
                    :options="excludedAudiencesList"
                    :props="audiencesCascaderProp"
                    ref="adGroupFormExcludedAudienceIds"
                    clearable
                    filterable
                    @change="handleChangeAdGroupFormExcludedAudienceIds"
                  ></el-cascader>
                  <el-tooltip effect="dark" content="点击刷新，可同步该账户里的可用受众包" placement="top-start">
                    <el-button style="margin-left: 5px" type="text" icon="el-icon-refresh-right"
                               @click="getAudiencesList(true)" v-loading="audiencesBtnLoading"></el-button>
                  </el-tooltip>
                </el-form-item>
                <span style="font-weight: bolder; font-size: 18px;"
                      v-if="adGroupForm.placementType ==='PLACEMENT_TYPE_AUTOMATIC'||adGroupForm.placement.includes('PLACEMENT_TIKTOK')">兴趣和行为</span>
                <el-row>
                  <el-col :span="12">
                    <el-form-item label="预设兴趣"
                                  v-if="adGroupForm.placementType ==='PLACEMENT_TYPE_AUTOMATIC'||adGroupForm.placement.includes('PLACEMENT_TIKTOK')">
                      <el-cascader
                        v-model="adGroupForm.interestCategory"
                        size="mini"
                        :options="tiktokInterestTree"
                        :props="{
                      expandTrigger: 'hover',
                      multiple: true,
                      }"
                        ref="tiktokInterestTreeC"
                        clearable
                        filterable
                        @change="handleInterestNodeClick"
                      ></el-cascader>
                      <el-button style="margin-left: 5px" type="text" icon="el-icon-refresh-right"
                                 @click="getTiktokInterestTree(true)" v-loading="interestBtnLoading"></el-button>
                    </el-form-item>
                  </el-col>
                  <el-col :span="12">
                    <el-form-item label="其它兴趣"
                                  v-if="adGroupForm.placementType ==='PLACEMENT_TYPE_AUTOMATIC'||adGroupForm.placement.includes('PLACEMENT_TIKTOK')">
                      <el-select
                        v-model="adGroupForm.interestsByKeywordIds"
                        multiple
                        filterable
                        remote
                        reserve-keyword
                        placeholder="请输入关键词"
                        size="mini"
                        :remote-method="queryInterestsByKeyword"
                        :loading="queryInterestsLoading"
                        @change="handleChangeOtherInterest">
                        <el-option
                          v-for="item in otherInterestList"
                          :key="item.id"
                          :label="item.name"
                          :value="item.id">
                        </el-option>
                      </el-select>
                    </el-form-item>
                  </el-col>
                </el-row>
                <template
                  v-if="adGroupForm.placementType ==='PLACEMENT_TYPE_AUTOMATIC'||adGroupForm.placement.includes('PLACEMENT_TIKTOK')">
                  <span style="font-weight: bold;">添加行为:视频互动</span>
                  <el-form-item label="定义他们与视频互动行为" prop="videoUserAction.VIDEO_RELATED"
                                ref="adGroup-videoUserAction.VIDEO_RELATED">
                    <el-checkbox-group v-model="adGroupForm.videoUserAction.VIDEO_RELATED"
                                       @change="handleChangeVideoRelated">
                      <el-checkbox label="WATCHED_TO_END">看完</el-checkbox>
                      <el-checkbox label="LIKED">点赞</el-checkbox>
                      <el-checkbox label="COMMENTED">评论</el-checkbox>
                      <el-checkbox label="SHARED">分享</el-checkbox>
                    </el-checkbox-group>
                  </el-form-item>
                  <el-form-item label="选择他们与哪些类别的视频有互动" prop="videoRelatedCategoryIds"
                                ref="adGroup-videoRelatedCategoryIds">
                    <el-cascader
                      v-model="adGroupForm.videoRelatedCategory"
                      size="mini"
                      :options="videoRelatedTree"
                      :props="{
                      expandTrigger: 'hover',
                      multiple: true,
                      }"
                      ref="videoRelatedTreeC"
                      clearable
                      filterable
                      @change="handleVideoNodeClick"
                    ></el-cascader>
                  </el-form-item>
                  <el-form-item label="选择n天内发生的行为" prop="actionPeriod" ref="adGroup-actionPeriod">
                    <el-radio-group v-model="adGroupForm.actionPeriod">
                      <el-radio label="7" @click.native.stop.prevent="handleActionPeriodClick('7')">7 天</el-radio>
                      <el-radio label="15" @click.native.stop.prevent="handleActionPeriodClick('15')">15 天</el-radio>
                    </el-radio-group>
                  </el-form-item>
                  <span style="font-weight: bold;">添加行为:创作者互动</span>
                  <el-form-item label="定义他们与创作者互动的方式" prop="videoUserAction.CREATOR_RELATED"
                                ref="adGroup-videoUserAction.CREATOR_RELATED">
                    <el-checkbox-group v-model="adGroupForm.videoUserAction.CREATOR_RELATED">
                      <el-checkbox label="FOLLOWING">关注</el-checkbox>
                      <el-checkbox label="VIEW_HOMEPAGE">访问主页</el-checkbox>
                    </el-checkbox-group>
                  </el-form-item>
                  <el-form-item label="选择他们与哪些类别的创作者互动" prop="creatorRelatedCategoryIds"
                                ref="adGroup-creatorRelatedCategoryIds">
                    <el-cascader
                      v-model="adGroupForm.creatorRelatedCategory"
                      size="mini"
                      :options="creatorRelatedTree"
                      :props="{
                      expandTrigger: 'hover',
                      multiple: true,
                      }"
                      ref="creatorRelatedTreeC"
                      clearable
                      filterable
                      @change="handleCreatorNodeClick"
                    ></el-cascader>
                  </el-form-item>
                </template>
                <span>设备</span>
                <el-form-item label="系统版本">
                  <el-select v-model="tempValue" placeholder="不限" disabled size="mini">
                    <el-option
                      :label="'不限'"
                      :value="'不限'">
                    </el-option>
                  </el-select>
                </el-form-item>
                <el-form-item label="设备机型">
                  <el-select v-model="tempValue" placeholder="不限" disabled size="mini">
                    <el-option
                      :label="'不限'"
                      :value="'不限'">
                    </el-option>
                  </el-select>
                </el-form-item>
                <el-form-item label="网络情况">
                  <el-checkbox-group v-model="checkboxNetworkState" size="mini" disabled>
                    <el-checkbox-button v-for="item in networkStateList" :label="item.label" :key="item.value">
                      {{ item.label }}
                    </el-checkbox-button>
                  </el-checkbox-group>
                </el-form-item>
                <el-form-item label="运营商">
                  <el-select v-model="tempValue" placeholder="不限" disabled size="mini">
                    <el-option
                      :label="'不限'"
                      :value="'不限'">
                    </el-option>
                  </el-select>
                </el-form-item>
                <el-form-item label=""
                              v-if="adGroupForm.placementType ==='PLACEMENT_TYPE_AUTOMATIC'||adGroupForm.placement.includes('PLACEMENT_TIKTOK')">
                  <el-switch
                    v-model="adGroupForm.expansionEnabled"
                    :active-color="activeColor"
                    :inactive-color="inactiveColor"
                    active-text="定向扩量"
                    inactive-text=""
                    :active-value="1"
                    :inactive-value="0"
                    :disabled="adGroupForm.expansionswitch"
                  >
                  </el-switch>
                  <div class="row-tips">启用定向扩量，将会在合适的时机扩大广告的受众范围，从而提升广告转化数。</div>
                </el-form-item>
                <el-collapse-transition>
                  <div v-show="adGroupForm.expansionEnabled===1">
                    <el-form-item label="只有您选择了至少一个条件的设置才可以使用定向扩展">
                      <el-checkbox-group v-model="adGroupForm.expansionTypes">
                        <el-checkbox label="CUSTOM_AUDIENCE"
                                     :disabled="!(adGroupForm.audienceIds.length>0)||!(adGroupForm.excludedAudienceIds.length>0)">
                          受众
                        </el-checkbox>
                        <el-checkbox label="GENDER" :disabled="adGroupForm.groupList[0].gender ==='GENDER_UNLIMITED'">
                          性别
                        </el-checkbox>
                        <el-checkbox label="AGE" :disabled="adGroupForm.groupList[0].age.length === 0">年龄</el-checkbox>
                        <el-checkbox label="INTEREST_AND_BEHAVIOR"
                                     :disabled="adGroupForm.interestCategoryIds.length === 0">兴趣和行为
                        </el-checkbox>
                      </el-checkbox-group>
                    </el-form-item>
                  </div>
                </el-collapse-transition>
              </basic-container>
              <basic-container ref="2-5">
                <div slot="header" class="card-header">
                  <div class="detail-top">
                    <div>预算&排期</div>
                  </div>
                </div>
                <el-form-item label="预算" prop="budget" ref="adGroup-budget">
                  <el-input
                    :placeholder="adGroupForm.budgetMode === 'BUDGET_MODE_DAY'?'20.00以上': countBudgetForDay()+'.00以上'"
                    size="mini"
                    v-model="adGroupForm.budget" class="input-with-select"
                    oninput="if(isNaN(value)){value=null} if(value.indexOf(0) === 0 && value.charAt(1) !== '.'){value=0} if(value.indexOf('.')>0){value=value.slice(0,value.indexOf('.')+3)}">
                    <el-select style="width: 100px" id="AdGroupBudgetChange" v-model="adGroupForm.budgetMode"
                               slot="prepend" placeholder="请选择"
                               @change="handleAdGroupBudgetChange"
                               :disabled="campaignForm.budgetSwitch&&campaignForm.budgetMode ==='BUDGET_MODE_DAY'">
                      <el-option v-for="item in budgetModeList" :key="item.value" :label="item.label"
                                 :value="item.value"></el-option>
                    </el-select>
                    <template slot="append">USD</template>
                  </el-input>
                </el-form-item>
                <el-form-item>
                  <!--排期-->
                  <div slot="label"><span>排期</span><span>时区：UTC{{ formatterTimezone }}</span></div>
                  <div id="adGroupForm.budget">
                    <el-radio v-model="adGroupForm.scheduleType" :label="'SCHEDULE_FROM_NOW'"
                              :disabled="adGroupForm.budgetMode === 'BUDGET_MODE_TOTAL'">开始时间
                    </el-radio>
                    <div class="row-tips">
                      从开始时间起持续投放广告
                    </div>
                  </div>
                  <div>
                    <el-radio v-model="adGroupForm.scheduleType" :label="'SCHEDULE_START_END'">开始时间&停止时间</el-radio>
                  </div>
                  <div class="row-tips">
                    从开始时间起开始投放广告，到达停止时间自动停止广告投放
                  </div>
                </el-form-item>
                <el-row>
                  <el-col :span="12">
                    <el-form-item prop="scheduleStartTime" ref="adGroup-scheduleStartTime">
                      <el-date-picker
                        size="mini"
                        v-model="adGroupForm.scheduleStartTime"
                        :picker-options="pickerOptions"
                        type="datetime"
                        value-format="yyyy-MM-dd HH:mm:ss"
                        placeholder="选择开始日期时间">
                      </el-date-picker>
                    </el-form-item>
                  </el-col>
                  <el-col :span="12">
                    <el-form-item prop="scheduleEndTime" ref="adGroup-scheduleEndTime">
                      <el-date-picker
                        v-show="adGroupForm.scheduleType==='SCHEDULE_START_END'"
                        style="margin-left: 10px"
                        size="mini"
                        value-format="yyyy-MM-dd HH:mm:ss"
                        v-model="adGroupForm.scheduleEndTime"
                        :picker-options="pickerOptions"
                        type="datetime"
                        placeholder="选择结束日期时间">
                      </el-date-picker>
                    </el-form-item>
                  </el-col>
                </el-row>
                <el-form-item label="分时段">
                  <el-radio-group v-model="adGroupForm.dayparting" size="mini">
                    <el-radio-button :label="1">全天</el-radio-button>
                    <el-radio-button :label="0" disabled>分时段</el-radio-button>
                  </el-radio-group>
                </el-form-item>
                <el-form-item>
                  <el-collapse-transition>
                    <div v-show="adGroupForm.dayparting === 0">
                      <drag-weektime
                        v-model="multTimeRange"
                        :data="weektimeData"
                        v-peach:event="{category: 'components', action: 'dragWeektime'}"
                        @on-clear="clearWeektime">
                      </drag-weektime>
                    </div>
                  </el-collapse-transition>
                </el-form-item>
              </basic-container>
              <basic-container ref="2-6">
                <div slot="header" class="card-header">
                  <div class="detail-top">
                    <div>出价</div>
                  </div>
                </div>
                <el-form-item label="优化目标">
                  <el-select v-model="adGroupForm.optimizationGoal" placeholder="请选择" size="mini"
                             @change="handleChangeOptimizationGoal" id="optimization-1">
                    <el-option
                      v-for="item in curOptimizationGoalList"
                      :key="item.value"
                      :label="item.label"
                      :value="item.value"
                      :disabled="campaignForm.os === 2 && item.value=== 'VALUE'">
                    </el-option>
                  </el-select>
                </el-form-item>
                <el-collapse-transition id="adGroup-optimi-2">
                  <div
                    v-show="adGroupForm.optimizationGoal ==='IN_APP_EVENT'||adGroupForm.optimizationGoal ==='INSTALL_IN_APP_EVENT'">
                    <el-form-item
                      :label="adGroupForm.optimizationGoal ==='IN_APP_EVENT'?'选择要优化投放的应用内事件数据':'选择要优化投放的安装与应用内事件数据'"
                      prop="optimizationEvent" ref="adGroup-optimizationEvent">
                      <el-select v-model="adGroupForm.optimizationEvent" placeholder="请选择" size="mini"
                                 :disabled="optimizationEventLoading">
                        <el-option
                          v-for="item in optimizationEventList"
                          :disabled="item.disabled"
                          :key="item.id"
                          :label="item.label"
                          :value="item.value">
                        </el-option>
                      </el-select>
                      <el-button style="margin-left: 5px" type="text" icon="el-icon-refresh-right"
                                 @click="getOptimizationEventList(true)"
                                 v-loading="optimizationEventLoading"></el-button>
                    </el-form-item>
                  </div>
                </el-collapse-transition>
                竞价策略
                <el-form-item id="handleRoas" label="最高价值" v-if="adGroupForm.optimizationGoal === 'VALUE'"
                              prop="roasBid"
                              ref="adGroup-roasBid">
                  <el-checkbox v-model="adGroupForm.isSetROAS" @change="handleRoasCheck">设置广告花费回报(ROAS)下限值</el-checkbox>
                  <el-collapse-transition>
                    <div v-show="adGroupForm.isSetROAS">
                      <el-input size="mini" v-model="adGroupForm.roasBid"
                                oninput="if(isNaN(value)){value=null} if(value.indexOf(0) === 0 && value.charAt(1) !== '.'){value=0} if(value.indexOf('.')>0){value=value.slice(0,value.indexOf('.')+3)}"></el-input>
                    </div>
                  </el-collapse-transition>
                </el-form-item>
                <template v-else>
                  <el-form-item>
                    <el-radio v-model="adGroupForm.bidType" :label="'BID_TYPE_CUSTOM'" @change="handleChangeBidType"
                              id="dGroup-bidPr">
                      {{ adGroupForm.optimizationGoal === 'CLICK' ? '出价' : '成本' }}上限
                    </el-radio>
                    <div class="row-tips">
                      平均成本稳定在出价附近或低于您的出价
                    </div>
                  </el-form-item>
                  <el-row v-show="adGroupForm.bidType ==='BID_TYPE_CUSTOM'">
                    <el-col :span="10">
                      <el-form-item v-show="adGroupForm.optimizationGoal === 'CLICK'" label="每次转化费用" prop="bidPrice"
                                    ref="adGroup-bidPrice" style="margin-bottom: unset">
                        <el-input size="mini" v-model="adGroupForm.bidPrice"
                                  oninput="if(isNaN(value)){value=null} if(value.indexOf(0) === 0 && value.charAt(1) !== '.'){value=0} if(value.indexOf('.')>0){value=value.slice(0,value.indexOf('.')+3)}">
                          <template slot="append">USD</template>
                        </el-input>
                      </el-form-item>
                      <el-form-item v-show="adGroupForm.optimizationGoal !== 'CLICK'" label="每次转化费用"
                                    prop="conversionBidPrice" ref="adGroup-conversionBidPrice"
                                    style="margin-bottom: unset">
                        <el-input size="mini"
                                  v-model="adGroupForm.conversionBidPrice"
                                  oninput="if(isNaN(value)){value=null} if(value.indexOf(0) === 0 && value.charAt(1) !== '.'){value=0} if(value.indexOf('.')>0){value=value.slice(0,value.indexOf('.')+3)}">
                          <template slot="append">USD</template>
                        </el-input>
                      </el-form-item>
                    </el-col>
                    <el-col :span="14" v-show="isPangleRO">
                      <el-form-item label="次日留存率：" style="margin-bottom: unset">
                        <el-input size="mini" v-model="adGroupForm.dailyRetentionRatio">
                          <template slot="append">%</template>
                        </el-input>
                      </el-form-item>
                    </el-col>
                  </el-row>
                  <el-form-item v-if="adGroupForm.optimizationGoal !== 'INSTALL_IN_APP_EVENT'">
                    <el-radio v-model="adGroupForm.bidType" :label="'BID_TYPE_NO_BID'"
                              @change="handleChangeBidType" id="el-bidType-1">最低成本
                    </el-radio>
                  </el-form-item>
                </template>
                <el-link type="primary" @click="AdvancedOpt=!AdvancedOpt">隐藏高级选项</el-link>
                <el-collapse-transition>
                  <div v-show="AdvancedOpt">
                    <el-form-item label="计费点">
                      <div class="row-tips">
                        展现（{{ adGroupForm.optimizationGoal === 'CLICK' ? 'CPC' : 'oCPM' }}）
                      </div>
                    </el-form-item>
                    <el-form-item label="投放速度" id="el-smmoth">
                      <el-radio v-model="adGroupForm.pacing" :label="'PACING_MODE_SMOOTH'">标准</el-radio>
                      <div class="row-tips">
                        系统将在所选广告投放时间段根据业务访问量均匀匹配你的预算和广告。 访问量越高，广告投放频次越高，反之亦然。
                      </div>
                      <el-radio v-show="adGroupForm.bidType === 'BID_TYPE_CUSTOM'" v-model="adGroupForm.pacing"
                                :disabled="adGroupForm.optimizationGoal === 'VALUE'"
                                :label="'PACING_MODE_FAST'" id="el-fast-1">加速
                      </el-radio>
                    </el-form-item>
                  </div>
                </el-collapse-transition>
              </basic-container>
            </el-form>
          </div>
          <div class="compagin-layout-right" id="compagin-layout-right-1">
            <basic-container>
              <div slot="header" class="card-header">
                <div class="detail-top">
                  <div>将生成{{ renderAdGroupList.length }}个广告组</div>
                </div>
                <!--<el-button type="text" icon="el-icon-close" @click="pageType = 1"></el-button>-->
              </div>
              <div class="ad-group-card" v-for="(item,index) in renderAdGroupList" :key="index">
                <!--<el-button type="text" icon="el-icon-close" class="ad-group-card-close"-->
                <!--           @click="removeAdGroup"></el-button>-->
                <div class="ad-group-card-main">
                  <div class="ad-group-card-content">
                    <!--<el-input v-model="item.adgroupName" size="mini"></el-input>-->
                    <div>广告组：{{ item.adgroupName }}</div>
                    <div>地区： {{ filterLocation(item.locationIds) }}</div>
                    <div>语言：{{ item.languages == '' ? '不限' : filterLanguages(item.languages) }}</div>
                    <div>性别：{{ filterGender(item.gender) }}</div>
                    <div>年龄：{{ item.age == '' ? '不限' : filterAge(item.age) }}</div>
                    <div></div>
                  </div>
                </div>
              </div>
            </basic-container>
          </div>
        </div>
      </div>
      <div class="compaign-detail-wrapper-right" v-show="campaignStep ===3">
        <div class="compagin-opt">
          <el-button @click="backToIndex" class="w-btn">返回任务列表</el-button>
          <!--<el-button size="mini" type="info" @click="saveDraft">保存草稿</el-button>-->
          <el-button type="primary" v-show="opeType < 4" @click="campaignStep=2" id="el-go-2" class="w-btn">上一步
          </el-button>
          <el-button type="primary" @click="createFinallyTableData" id="el-Table-2" class="w-btn">生成</el-button>
        </div>
        <div class="compagin-layout" id="el-compagin-layout-2">
          <div class="compagin-layout-left" id="compagin-layout-left-2">
            <el-form label-position="top" label-width="80px" :model="adForm.adList[curEditAdgroup]" :rules="adFormRules"
                     ref="adFrom">
              <basic-container ref="3-1">
                <div slot="header" class="card-header">
                  <div class="detail-top">
                    <div>广告名称</div>
                  </div>
                </div>
                <div class="row-tips">默认用素材名作为广告名，在下一个生成广告的页面里，可自定义广告名。</div>
              </basic-container>
              <basic-container ref="3-2">
                <div slot="header" class="card-header" id="card-heade-2">
                  <div class="detail-top">
                    <div>广告发布者身份</div>
                  </div>
                </div>
                <el-form-item label="">
                  <el-switch
                    v-model="adForm.sparkAdsSwitch"
                    :active-color="activeColor"
                    :inactive-color="inactiveColor"
                    disabled
                    active-text="使用 TikTok 账号投放 Spark Ads "
                    inactive-text="">
                  </el-switch>
                  <div class="row-tips">申请使用 TikTok 账号个人帖子的权限，然后使用该账号的身份投放广告。</div>
                </el-form-item>
                <el-form-item label="" prop="adIdentityId" required ref="ad-adIdentityId">
                  <el-select size="mini" v-model="adForm.adList[curEditAdgroup].adIdentityId" placeholder="请选择身份"
                             allow-create
                             default-first-option clearable>
                    <el-option
                      v-for="item in identityList"
                      :key="item.id"
                      :label="item.displayName"
                      :value="item.identityId">
                      <span style="float: left"><el-avatar :size="30" :src="item.identityIcon"></el-avatar></span>
                      <span style="float: right"> {{ item.displayName }}
                      </span>
                    </el-option>
                    <div slot="prefix" style="line-height: 34px;">
                      <el-image
                        style="width: 20px; height: 20px;vertical-align: middle"
                        :src="identityIconUrl(adForm.adList[curEditAdgroup].adIdentityId)"
                        fit="contain"></el-image>
                    </div>
                  </el-select>
                  <el-button style="margin-left: 5px" type="text" icon="el-icon-refresh-right"
                             @click="getIdentityList(true)" v-loading="identityBtnLoading"></el-button>
                  <!--<el-input size="mini" v-model="adForm.adIdentityId" placeholder="请输入内容"-->
                  <!--          ></el-input>-->
                </el-form-item>
                <el-form-item>
                  <el-button size="mini" type="text" icon="el-icon-plus" @click="addIdentityDialog = true">添加自定义身份
                  </el-button>
                  <el-dialog
                    title="添加自定义身份名称"
                    :visible.sync="addIdentityDialog"
                    :close-on-click-modal="false"
                    :modal-append-to-body="false"
                    :modal="false"
                    width="300px">
                    <el-form :model="identityForm" ref="identityForm" label-width="0px" @submit.native.prevent>
                      <el-form-item
                        prop="value"
                        :rules="[
                      { required: true, message: '身份名称不能为空',trigger: 'blur'},
                    ]"
                      >
                        <el-upload
                          style="display:inline-block;"
                          class="identity-upload"
                          action="#"
                          :http-request="uploadQiniuCloud"
                          :before-upload="beforeAvatarUpload"
                          :show-file-list="false"
                          list-type="picture">
                          <el-avatar :size="50" :src="logoUrl" :key="logoUrl"></el-avatar>
                        </el-upload>
                        &nbsp;
                        <el-input v-model="identityForm.value" style="width: 75%"></el-input>
                      </el-form-item>
                    </el-form>
                    <span slot="footer" class="dialog-footer" id="dialog-footer-10">
                    <el-button @click="addIdentityDialog = false">取 消</el-button>
                    <el-button type="primary" @click="addIdentity" v-loading="addIdentityLoading">确 定</el-button>
                  </span>
                  </el-dialog>
                </el-form-item>
              </basic-container>
              <basic-container v-show="adGroupForm.creativeMaterialMode ==='CUSTOM'">
                <el-collapse-transition>
                  <div v-show="adForm.batch" id="adefom-1">
                    <el-form-item label="">
                      <el-row>
                        <el-col :span="12">
                          <el-radio v-model="adForm.adList[curEditAdgroup].autoCreateType" :label="1"
                                    @change="()=>{this.clearCreativeText();this.createRenderAdList()}">对应
                          </el-radio>
                          <div class="row-tips">
                            单素材单文案创建广告
                          </div>
                        </el-col>
                        <el-col :span="12">
                          <el-radio v-model="adForm.adList[curEditAdgroup].autoCreateType" :label="2"
                                    @change="()=>{this.clearCreativeText();this.createRenderAdList()}">组合
                          </el-radio>
                          <div class="row-tips">
                            多素材多文案创建广告
                          </div>
                        </el-col>
                      </el-row>
                    </el-form-item>
                  </div>
                </el-collapse-transition>
              </basic-container>
              <basic-container ref="3-3" id="card-head-1">
                <div slot="header" class="card-header">
                  <div class="detail-top">
                    <div>创意素材</div>
                  </div>
                </div>
                <el-form-item label="" ref="adCreative">
                  <el-button icon="el-icon-plus" @click="showCreativeDrawer" id="el-icon-1">从素材库上传</el-button>
                  <el-button type="danger" icon="el-icon-delete" @click="()=>{
                    adForm.adList[curEditAdgroup].creativeList=[];createRenderAdList()
                  }">清空
                  </el-button>
                </el-form-item>
                <el-form-item id="adForm.ba-1">
                  <template v-if="adForm.batch">
                    <template v-if="adForm.adList[curEditAdgroup].autoCreateType ===1">
                      <div v-if="adForm.adList[curEditAdgroup].creativeList.length>0" class="creative-card"
                           v-for="(creative,index) in adForm.adList[curEditAdgroup].creativeList" :key="index">
                        <div style="margin: 2px">
                          <el-button type="text"
                                     v-if="creative.type == 1"
                                     @click="handleOpenSuggestCover(creative, campaignForm.platformId, 'create')"
                          >
                            <i class="el-icon-picture">视频封面</i>
                          </el-button>
                        </div>
                        <div style="display: inline-block; position: relative">
                          <div style="display: inline-block;cursor: pointer;"
                               :class="creative.type == 1?'play-icon':''">
                            <el-tooltip effect="dark" :content="creative.name" placement="bottom">
                              <el-image
                                v-if="creative.type == 1"
                                style="width: 100px; height: 100px"
                                :src="creative.thumbnailUrl"
                                @click="handlePreview(creative)"
                              >
                              </el-image>
                              <el-image
                                v-else
                                style="width: 100px; height: 100px"
                                :src="creative.creativeUrl"
                                @click="handlePreview(creative)"
                                :fit="'cover'">
                              </el-image>
                            </el-tooltip>
                            <div style="margin-left: 30px; margin-top: -10px;">ID:{{ creative.shortId }}</div>
                          </div>
                          <el-button type="danger" icon="el-icon-delete" size="mini" circle
                                     style="position: absolute;top: 0;right: 0"
                                     @click="adForm.adList[curEditAdgroup].creativeList.splice(index,1);createRenderAdList()"></el-button>
                        </div>
                        <div v-for="(word,iw) in creative.words">
                          <el-autocomplete
                            size="mini"
                            v-model="creative.words[iw]"
                            :fetch-suggestions="queryCreativeTextSearch"
                            id="TextSear-1"
                            placeholder="请输入文案"
                            @input="()=>{
                              $forceUpdate();createRenderAdList()
                            }"
                          ></el-autocomplete>
                          <el-button v-if="iw===0" size="mini" type="text" icon="el-icon-plus"
                                     @click="creative.words.push('');$forceUpdate()"
                                     style="margin-left: 10px"></el-button>
                          <el-button v-else size="mini" type="text" icon="el-icon-minus"
                                     @click="()=>{creative.words.splice(iw,1);$forceUpdate();createRenderAdList()}"
                                     style="margin-left: 10px"></el-button>
                        </div>
                        <div>
                          <i class="el-icon-circle-plus-outline" style="color: #34acff;font-size: 15px;cursor:pointer;"
                             @click="showTextSelection(index)"></i>
                          <span style="margin-left: 5px;color:#34acff;cursor:pointer;"
                                @click="showTextSelection(index)" id="circle-plus-outline">从文案库选择文案</span>
                        </div>
                      </div>
                    </template>
                    <template v-else>
                      <div class="creative-card" id="tive-card"
                           v-if="adForm.adList[curEditAdgroup].creativeList.length>0"
                           v-for="(creative,index) in adForm.adList[curEditAdgroup].creativeList" :key="index"
                           style="display: inline-block;margin-right: 10px">
                        <div style="margin: 2px">
                          <el-button type="text"
                                     v-if="creative.type == 1"
                                     @click="handleOpenSuggestCover(creative, campaignForm.platformId, 'create')"
                          >
                            <i class="el-icon-picture">视频封面</i>
                          </el-button>
                        </div>
                        <div style="display: inline-block; position: relative">
                          <div style="display: inline-block"
                               :class="creative.type == 1?'play-icon':''">
                            <el-image
                              v-if="creative.type == 1"
                              style="width: 100px; height: 100px"
                              :src="creative.thumbnailUrl"
                              @click="handlePreview(creative)"
                            >
                            </el-image>
                            <el-image
                              v-else
                              style="width: 100px; height: 100px"
                              :src="creative.creativeUrl"
                              :fit="'cover'"
                              @click="handlePreview(creative)"
                            >
                            </el-image>
                          </div>
                          <el-button type="danger" icon="el-icon-delete" size="mini" circle
                                     style="position: absolute;top: 0;right: 0"
                                     @click="adForm.adList[curEditAdgroup].creativeList.splice(index,1);createRenderAdList()"></el-button>
                        </div>
                        <div style="margin-left: 20px; margin-top: -10px;">ID:{{ creative.shortId }}</div>
                      </div>

                      <div v-for="(word,iw) in adForm.adList[curEditAdgroup].words">
                        <el-autocomplete
                          size="mini"
                          v-model="adForm.adList[curEditAdgroup].words[iw]"
                          :fetch-suggestions="queryCreativeTextSearch"
                          placeholder="请输入内容"
                          id="CreativeText"
                          @input="()=>{
                              $forceUpdate();createRenderAdList()
                            }"
                        ></el-autocomplete>
                        <el-button v-if="iw===0" size="mini" type="text" icon="el-icon-plus"
                                   @click="addWordsForDynamic"
                                   style="margin-left: 10px"></el-button>
                        <el-button v-else size="mini" type="text" icon="el-icon-minus"
                                   @click="()=>{adForm.adList[curEditAdgroup].words.splice(iw,1);createRenderAdList()}"
                                   style="margin-left: 10px"></el-button>
                      </div>
                      <div>
                        <i class="el-icon-circle-plus-outline" style="color: #34acff;font-size: 15px;cursor:pointer;"
                           @click="showTextSelection(-1)"></i>
                        <span style="margin-left: 5px;color:#34acff;cursor:pointer;" @click="showTextSelection(-1)"
                              id="showTextSelec">从文案库选择文案</span>
                      </div>
                    </template>
                  </template>
                  <template v-else>
                    <div class="creative-card" v-if="adForm.adList[curEditAdgroup].creativeList.length > 0">
                      <div style="display: inline-block"
                           :class="adForm.adList[curEditAdgroup].creativeList[0].type == 1?'play-icon':''">
                        <el-image
                          v-if="adForm.adList[curEditAdgroup].creativeList[0].type == 1"
                          style="width: 100px; height: 100px"
                          :src="adForm.adList[curEditAdgroup].creativeList[0].thumbnailUrl"
                          @click="handlePreview(adForm.creativeList[0])"
                        >
                        </el-image>
                        <el-image
                          v-else
                          style="width: 100px; height: 100px"
                          :src="adForm.adList[curEditAdgroup].creativeList[0].creativeUrl"
                          :fit="'cover'"
                          @click="handlePreview(adForm.creativeList[0])"
                        >
                        </el-image>
                      </div>
                      <div>
                        <el-autocomplete
                          size="mini"
                          v-model="adForm.adList[curEditAdgroup].word"
                          :fetch-suggestions="queryCreativeTextSearch"
                          placeholder="请输入内容"
                          id="queryCreativeTextSear-1"
                          @input="()=>{
                              $forceUpdate();createRenderAdList()
                            }"
                        ></el-autocomplete>
                      </div>
                    </div>
                  </template>
                </el-form-item>
                <el-form-item label="" id="el-from-createRednd-1">
                  <div>
                    <el-radio v-model="adForm.adList[curEditAdgroup].callToActionType" label="1"
                              @change="createRenderAdList">动态优选
                    </el-radio>
                  </div>
                  <div>
                    <el-radio v-model="adForm.adList[curEditAdgroup].callToActionType" label="0"
                              @change="createRenderAdList">标准
                    </el-radio>
                  </div>
                </el-form-item>
                <el-collapse-transition>
                  <div v-show="adForm.adList[curEditAdgroup].callToActionType == '0'">
                    <el-form-item v-show="adGroupForm.creativeMaterialMode === 'CUSTOM'" prop="callToAction"
                                  ref="ad-callToAction">
                      <el-select v-model="adForm.adList[curEditAdgroup].callToAction"
                                 placeholder="请选择" size="mini" @change="createRenderAdList">
                        <el-option v-for="item in callToActionList"
                                   :key="item.value"
                                   :label="item.label"
                                   :value="item.value">
                        </el-option>
                      </el-select>
                    </el-form-item>
                    <el-form-item v-show="adGroupForm.creativeMaterialMode === 'DYNAMIC'" prop="callToActionArr"
                                  ref="ad-callToActionArr">
                      <el-select v-model="adForm.adList[curEditAdgroup].callToActionArr" multiple :multiple-limit="3"
                                 placeholder="请选择"
                                 size="mini" @change="createRenderAdList">
                        <el-option v-for="item in callToActionList"
                                   :key="item.value"
                                   :label="item.label"
                                   :value="item.value">
                        </el-option>
                      </el-select>
                    </el-form-item>
                  </div>
                </el-collapse-transition>
              </basic-container>
              <basic-container ref="3-5" v-if="campaignForm.campaignAppProfilePageState ==='ON'">
                <div slot="header" class="card-header">
                  <div class="detail-top">
                    <div>目标页</div>
                  </div>
                </div>
                <el-form-item label="应用介绍页" prop="pageId" ref="ad-pageId">
                  <el-select size="mini" v-model="adForm.adList[curEditAdgroup].pageId" placeholder="请选择应用介绍页"
                             @change="handleChangeLandingPage">
                    <el-option
                      v-for="item in landingPageList"
                      :key="item.value"
                      :label="item.label+'  ID:'+item.value"
                      :value="item.value">
                    </el-option>
                  </el-select>
                  <el-button style="margin-left: 5px" type="text" icon="el-icon-refresh-right"
                             @click="getLandingPageList" v-loading="landingPageLoading"></el-button>
                  <div style="margin-top:10px">
                    <el-image
                      v-show="adForm.adList[curEditAdgroup].imageUrl !== ''"
                      style="width: 100px; height: 180px"
                      :src="adForm.adList[curEditAdgroup].imageUrl"
                      fit="cover"></el-image>
                  </div>
                </el-form-item>
              </basic-container>
              <basic-container ref="3-4" id="el-detail-4">
                <div slot="header" class="card-header">
                  <div class="detail-top">
                    <div>检测</div>
                  </div>
                </div>
                第三方监测设置
                <el-form-item label="展现监测URL">
                  <el-input type="textarea" size="mini" v-model="adForm.impressionTrackingUrl"></el-input>
                </el-form-item>
                <el-form-item label="点击监测URL">
                  <el-input type="textarea" size="mini" v-model="adForm.clickTrackingUrl" disabled></el-input>
                </el-form-item>
              </basic-container>
            </el-form>
          </div>
          <div class="compagin-layout-right" id="layout-right-2">
            <basic-container>
              <div slot="header" class="card-header">
                <div class="detail-top">
                  <div>将生成{{ renderAdList[curEditAdgroup].length }}个广告</div>
                </div>
              </div>
              <div class="ad-group-card" v-if="renderAdList[curEditAdgroup].length>0"
                   v-for="(item,index) in renderAdList[curEditAdgroup]"
                   :key="index">
                <!--<el-button type="text" icon="el-icon-close" class="ad-group-card-close"-->
                <!--           @click="removeRenderAdList(index)"></el-button>-->
                <div class="ad-group-card-main">
                  <div style="display: inline-block;margin-right: 5px"
                       v-if="item.creative !== null"
                       :class="item.creative.type == 1?'play-icon':''">
                    <el-image
                      v-if="item.creative.type == 1"
                      style="width: 100px; height: 100px"
                      :src="item.creative.thumbnailUrl"
                      @click="handlePreview(item.creative)"
                    >
                    </el-image>
                    <el-image
                      v-else
                      style="width: 100px; height: 100px"
                      :src="item.creative.creativeUrl"
                      :fit="'cover'"
                      @click="handlePreview(item.creative)"
                    >
                    </el-image>
                  </div>
                  <div class="ad-group-card-content" id="ad-group-card-content-2">
                    <div>
                      广告名：{{ item.adName }}
                    </div>
                    <div>
                      广告文案：{{ item.word }}
                    </div>
                    <div v-if="adForm.adList[curEditAdgroup].callToActionType =='0'">
                      CTA：{{ item.callToAction ? filterCallToAction(item.callToAction) : '' }}
                    </div>
                  </div>
                </div>
              </div>
            </basic-container>
          </div>
        </div>
      </div>
    </div>
    <div v-else-if="pageType === 3">
      <div class="report-opt" id="report-opt-3">
        <el-button @click="backToIndex" id="ToIndex-2" class="w-btn">返回任务列表</el-button>
        <!--<el-button size="mini" type="info" @click="saveDraft" id="saveDraft-2">保存草稿</el-button>-->
        <el-button type="primary" @click="pageType = 2;campaignStep=3" id="pageType-2" class="w-btn">上一步</el-button>
        <el-button type="primary" @click="submitCreateCampaign" v-loading="submitCampaignLoading"
                   id="submitCreate-2" class="w-btn">发布并暂停
        </el-button>
      </div>
      <basic-container>
        <div class="report-result-title">本次创建将生成 1个推广系列 {{ renderAdGroupList.length }}个广告组
          {{ sumAdCount() }}个广告
        </div>
        <el-table
          :data="tableData"
          border
          style="width: 100%">
          <el-table-column
            label="智能配置">
            <el-descriptions :column="1" size="mini">
              <el-descriptions-item label="">非CBO</el-descriptions-item>
              <el-descriptions-item label="">非SPC</el-descriptions-item>
              <el-descriptions-item label="">{{ adGroupForm.creativeMaterialMode === 'DYNAMIC' ? 'ACO' : '非ACO' }}
              </el-descriptions-item>
              <el-descriptions-item label="">{{ campaignForm.campaignAppProfilePageState === 'ON' ? 'APPO' : '非APPO' }}
              </el-descriptions-item>
            </el-descriptions>
          </el-table-column>
          <el-table-column
            label="预算&出价">
            <el-descriptions :column="1" size="mini">
              <el-descriptions-item label="推广系列 预算">{{
                  campaignForm.budgetSwitch ? campaignForm.budget : '不限'
                }}
              </el-descriptions-item>
              <el-descriptions-item label="广告组 预算">{{ adGroupForm.budget }}</el-descriptions-item>
              <el-descriptions-item label="出价" v-if="adGroupForm.optimizationGoal === 'VALUE'">
                {{ adGroupForm.bidPrice ? adGroupForm.roasBid : '无' }}
              </el-descriptions-item>
              <el-descriptions-item label="出价" v-else-if="adGroupForm.optimizationGoal === 'CLICK'">{{
                  adGroupForm.bidPrice ? adGroupForm.bidPrice : '最低成本'
                }}
              </el-descriptions-item>
              <el-descriptions-item label="出价" v-else>{{
                  adGroupForm.conversionBidPrice ? adGroupForm.conversionBidPrice : '最低成本'
                }}
              </el-descriptions-item>
            </el-descriptions>
          </el-table-column>
          <el-table-column
            label="优化目标&版位">
            <el-descriptions :column="1" size="mini">
              <el-descriptions-item label="版位">{{ formatterPlacement() }}</el-descriptions-item>
              <el-descriptions-item label="目标">{{ formatterOptimizationGoal() }}</el-descriptions-item>
              <el-descriptions-item label="深层事件">{{ formatterOptimizationEvent() }}</el-descriptions-item>
            </el-descriptions>
          </el-table-column>
          <el-table-column
            label="兴趣&行为">
            <el-descriptions :column="1" size="mini">
              <el-descriptions-item label="兴趣">{{ formatterInterest() }}</el-descriptions-item>
              <el-descriptions-item label="视频互动">{{ formatterVideoRelatedCategory() }}</el-descriptions-item>
              <el-descriptions-item label="创作者互动">{{ formatterCreatorRelatedCategory() }}</el-descriptions-item>
            </el-descriptions>
          </el-table-column>
          <el-table-column
            label="受众">
            <el-descriptions :column="1" size="mini">
              <el-descriptions-item label="包含">{{ formatterAudiences() }}</el-descriptions-item>
              <el-descriptions-item label="排除">{{ formatterExcludeAudiences() }}</el-descriptions-item>
            </el-descriptions>
          </el-table-column>
        </el-table>
        <el-table
          :data="finallyTableData"
          height="calc(100vh - 395px)"
          ref="finallyTable"
          :span-method="objectSpanMethod"
          @selection-change="handleFinallyTableSelectionChange"
          :key="Math.random()"
          style="width: 100%">
          <el-table-column
            label="广告组">
            <el-table-column
              prop="adgroupName"
              label="广告组名">
              <template v-slot="{row}">
                <el-input size="mini" v-model="row.adgroupName"></el-input>
              </template>
            </el-table-column>
            <el-table-column
              label="投放地区" width="120px">
              <template v-slot="{row}">
                {{ filterLocation(row.locationIds) }}
              </template>
            </el-table-column>
            <el-table-column
              label="语言" width="100px">
              <template v-slot="{row}">
                {{ row.languages == '' ? '不限' : filterLanguages(row.languages) }}
              </template>
            </el-table-column>
            <el-table-column
              label="性别" width="70px">
              <template v-slot="{row}">
                {{ filterGender(row.gender) }}
              </template>
            </el-table-column>
            <el-table-column
              label="年龄" width="100px">
              <template v-slot="{row}">
                {{ row.age == '' ? '不限' : filterAge(row.age) }}
              </template>
            </el-table-column>
          </el-table-column>
          <el-table-column
            label="广告">
            <el-table-column
              label="素材" width="120px">
              <template v-slot="{row}">
                <div style="display: inline-block"
                     :class="row.creative.type == 1?'play-icon':''">
                  <el-image
                    v-if="row.creative.type == 1"
                    style="width: 100px; height: 100px"
                    :src="row.creative.thumbnailUrl"
                    @click="handlePreview(row.creative)"
                  >
                  </el-image>
                  <el-image
                    v-else
                    style="width: 100px; height: 100px"
                    :src="row.creative.creativeUrl"
                    :fit="'cover'"
                    @click="handlePreview(row.creative)"
                  >
                  </el-image>
                </div>
              </template>
            </el-table-column>
            <el-table-column width="100px" label="落地页" v-if="campaignForm.campaignAppProfilePageState ==='ON'">
              <template v-slot="{row}">
                <div>
                  <el-image
                    v-show="row.imageUrl !== ''"
                    style="width: 60px; height: 100px"
                    :src="row.imageUrl"
                    fit="cover"
                    @click="handleImagePreview(row.imageUrl)"></el-image>
                </div>
              </template>
            </el-table-column>
            <el-table-column
              prop="adName"
              label="广告名">
              <template v-slot="{ row }">
                <el-input v-model="row.adName" size="mini" style="width:100%"
                          :disabled="adGroupForm.creativeMaterialMode ==='DYNAMIC'"></el-input>
              </template>
            </el-table-column>
            <el-table-column
              prop="word"
              label="文案" width="160px">
              <template v-slot="{row}">
                <div>{{ row.word }}</div>
                <div v-if="row.callToActionType == '0'">
                  CTA：{{ filterCallToAction(row.callToAction) }}
                </div>
              </template>
            </el-table-column>
            <el-table-column
              v-if="adGroupForm.creativeMaterialMode ==='CUSTOM'"
              prop="adIdentityId"
              label="发布者身份" width="120px">
              <template v-slot="{ row }">
                <el-select size="mini" v-model="row.adIdentityId" placeholder="请选择身份" allow-create
                           default-first-option clearable style="width: 100%;">
                  <el-option
                    v-for="item in identityList"
                    :key="item.id"
                    :label="item.displayName"
                    :value="item.identityId">
                    <span style="float: left"><el-avatar :size="30" :src="item.identityIcon"></el-avatar></span>
                    <span style="float: right"> {{ item.displayName }}
                      </span>
                  </el-option>
                  <div slot="prefix" style="line-height: 34px;">
                    <el-image
                      style="width: 20px; height: 20px;vertical-align: middle"
                      :src="identityIconUrl(row.adIdentityId)"
                      fit="contain"></el-image>
                  </div>
                </el-select>
              </template>
            </el-table-column>
            <el-table-column
              prop="word"
              label="应用介绍页" width="160px">
              <template v-slot="{row}">
                <el-select size="mini" v-model="row.pageId" placeholder="请选择应用介绍页"
                           @change="handleChangeLandingPageForTable($event,row)">
                  <el-option
                    v-for="item in landingPageList"
                    :key="item.value"
                    :label="item.label+'  ID:'+item.value"
                    :value="item.value">
                  </el-option>
                </el-select>
              </template>
            </el-table-column>
          </el-table-column>
          <el-table-column
            v-if="adGroupForm.creativeMaterialMode ==='CUSTOM'"
            type="selection"
            align="center"
            width="55">
          </el-table-column>
        </el-table>
      </basic-container>
    </div>
    <!--从素材库上传-->
    <el-drawer
      title="选择素材"
      size="65%"
      :visible.sync="uploadFromStroeDrawer"
      :modal-append-to-body="false"
      :close-on-click-modal="false"
      :append-to-body="false"
      :wrapperClosable="false"
      @close="creativeQueryForm={
        shortId: '',
        localFilename: '',
        name: '',
        type: '',
        date: '',
        beginDate: null,
        endDate: null,
        sizeType: '',
        requestName: '',
        strStatus: [1,2],
        designer: '',
        beginAuditDate: ''
      }"
    >
      <el-divider></el-divider>
      <cs-drawer-container id="creative-drawer-1">
        <div class="creative-drawer-box" id="creative-drawer-box-2">
          <el-form :inline="true" :model="creativeQueryForm" class="demo-form-inline">
            <el-form-item label="短ID" style="margin-bottom:2px;">
              <el-input style="width:270px" size="mini" v-model="creativeQueryForm.stringShortId"
                        placeholder="请输入短ID"></el-input>
            </el-form-item>
            <el-form-item label="本地文件名" style="margin-bottom:2px;">
              <el-input style="width:220px" size="mini" v-model="creativeQueryForm.localFilename"
                        placeholder="请输入本地文件名"></el-input>
            </el-form-item>
            <el-form-item label="素材名称" style="margin-bottom:2px;">
              <el-input style="width:220px" size="mini" v-model="creativeQueryForm.name"
                        placeholder="请输入素材名称"></el-input>
            </el-form-item>
            <el-form-item label="素材尺寸" style="margin-bottom:2px;">
              <el-select style="width: 140px" v-model="creativeQueryForm.sizeType" clearable placeholder="请选择素材尺寸"
                         size="mini">
                <el-option
                  v-for="item in sizeType"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value">
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="需求名称" style="margin-bottom:2px;">
              <el-input style="width:240px" size="mini" v-model="creativeQueryForm.requestName"
                        placeholder="请输入需求名称"></el-input>
            </el-form-item>
            <el-form-item label="设计师" style="margin-bottom:2px;">
              <el-select style="width: 130px" v-model="creativeQueryForm.designer" clearable filterable
                         size="mini"
                         placeholder="请选择设计师">
                <el-option
                  v-for="item in designersList"
                  :key="item.value"
                  :label="item.realName"
                  :value="item.id">
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="类型" style="margin-bottom:2px;">
              <el-select style="width: 125px" size="mini" v-model="creativeQueryForm.type" placeholder="类型"
                         :disabled="adGroupForm.placementType === 'PLACEMENT_TYPE_NORMAL'&&adGroupForm.placement[0]==='PLACEMENT_TIKTOK'">
                <el-option label="图片" :value="0"></el-option>
                <el-option label="视频" :value="1"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="有花费" style="margin-bottom:2px;">
              <el-select style="width: 125px" size="mini" v-model="creativeQueryForm.used">
                <el-option label="否" :value="0"></el-option>
                <el-option label="是" :value="1"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="上传时间">
              <el-date-picker
                size="mini"
                v-model="creativeQueryForm.date"
                type="daterange"
                range-separator="至"
                value-format="yyyy-MM-dd"
                start-placeholder="开始日期"
                end-placeholder="结束日期"
                @change="handleChangeCreativeDate">
              </el-date-picker>
            </el-form-item>
            <el-form-item label="审批通过时间">
              <el-date-picker
                size="mini"
                v-model="creativeQueryForm.beginAuditDate"
                type="date"
                value-format="yyyy-MM-dd"
                placeholder="包含此时间以后的记录">
              </el-date-picker>
            </el-form-item>
            <el-form-item label="状态">
              <el-select v-model="creativeQueryForm.strStatus" clearable filterable multiple collapse-tags
                         size="mini"
                         placeholder="请选择状态">
                <el-option
                  v-for="item in approvalStatusList"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value">
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item class="clear-4">
              <el-button size="mini" @click="clearCreativeQuery">重置</el-button>
              <el-button size="mini" type="primary" @click="getCreativeTabelData">查询</el-button>
            </el-form-item>
          </el-form>
          <div class="curd-table" id="curd-table-1">
            <div class="table-body">
              <el-table
                ref="createTable"
                :data="creativeTableData"
                tooltip-effect="dark"
                height="calc(100vh - 380px)"
                style="width: 100%"
                v-loading="creativeLoading"
                @selection-change="handleCreativeSelectionChange">
                <el-table-column
                  type="selection"
                  width="55">
                </el-table-column>
                <el-table-column
                  label="素材">
                  <template v-slot="{row}">
                    <el-tooltip effect="dark" content="点击预览素材" placement="bottom-end">
                      <div style="display: inline-block;cursor: pointer;"
                           :class="row.type == 1?'play-icon':''">
                        <el-image
                          v-if="row.type == 1"
                          style="width: 100px; height: 100px"
                          :src="row.thumbnailUrl"
                          @click="handlePreview(row)"
                        >
                        </el-image>
                        <el-image
                          v-else
                          style="width: 100px; height: 100px"
                          :src="row.creativeUrl"
                          :fit="'cover'"
                          @click="handlePreview(row)"
                        >
                        </el-image>
                      </div>
                    </el-tooltip>
                  </template>
                </el-table-column>
                <el-table-column
                  prop="shortId"
                  label="短ID"
                  show-overflow-tooltip>
                </el-table-column>
                <el-table-column
                  prop="localFilename"
                  label="本地文件名"
                  show-overflow-tooltip>
                </el-table-column>
                <el-table-column
                  prop="name"
                  label="素材名称"
                  show-overflow-tooltip>
                </el-table-column>
                <el-table-column
                  prop="type"
                  :formatter="formatterCreativeType"
                  label="类型"
                  width="100px">
                </el-table-column>
                <el-table-column
                  prop="used"
                  label="有花费"
                  width="100px"
                >
                  <template v-slot="{row}">
                    <el-tag> {{ row.used ? '是' : '否' }}</el-tag>
                  </template>
                </el-table-column>
                <el-table-column
                  prop="auditTime"
                  label="审批通过时间"
                  show-overflow-tooltip>
                </el-table-column>
              </el-table>
            </div>
            <div class="bottom-page clearfix">
              <el-pagination
                background
                @size-change="handleCreativeSizeChange"
                @current-change="handleCreativeCurrentChange"
                :current-page="creativePage.currentPage"
                :page-sizes="[10, 20, 30, 40, 50, 100]"
                :page-size="creativePage.pageSize"
                layout="total, sizes, prev, pager, next, jumper"
                :total="creativeTotal">
              </el-pagination>
            </div>
          </div>
        </div>
        <el-button slot="bottom" size="mini" @click="uploadFromStroeDrawer=false" id="uploadFrom-1">取消</el-button>
        <el-button slot="bottom" size="mini" type="primary" @click="submitCreative" id="submitCre-1">确定</el-button>
      </cs-drawer-container>
    </el-drawer>
    <!--编辑广告的素材选择-->
    <el-drawer
      title="选择素材"
      id="drawer"
      size="60%"
      :visible.sync="editFromStroeDrawer"
      :modal-append-to-body="false"
      :close-on-click-modal="false"
      :wrapperClosable="false"
    >
      <el-divider></el-divider>
      <cs-drawer-container>
        <div class="creative-drawer-box">
          <el-form :inline="true" :model="creativeQueryForm" class="demo-form-inline">
            <el-form-item label="短ID">
              <el-input size="mini" v-model="creativeQueryForm.stringShortId" placeholder="请输入短ID"></el-input>
            </el-form-item>
            <el-form-item label="本地文件名">
              <el-input size="mini" v-model="creativeQueryForm.localFilename" placeholder="请输入本地文件名"></el-input>
            </el-form-item>
            <el-form-item label="素材名称">
              <el-input size="mini" v-model="creativeQueryForm.name" placeholder="请输入素材名称"></el-input>
            </el-form-item>
            <el-form-item label="素材尺寸">
              <el-select v-model="creativeQueryForm.sizeType" clearable placeholder="请选择素材尺寸" size="mini">
                <el-option
                  v-for="item in sizeType"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value">
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="需求名称">
              <el-input size="mini" v-model="creativeQueryForm.requestName" placeholder="请输入需求名称"></el-input>
            </el-form-item>
            <el-form-item label="设计师">
              <el-select v-model="creativeQueryForm.designer" clearable filterable
                         size="mini"
                         placeholder="请选择设计师">
                <el-option
                  v-for="item in designersList"
                  :key="item.value"
                  :label="item.realName"
                  :value="item.id">
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="上传时间">
              <el-date-picker
                size="mini"
                v-model="creativeQueryForm.date"
                type="daterange"
                range-separator="至"
                value-format="yyyy-MM-dd"
                start-placeholder="开始日期"
                end-placeholder="结束日期"
                @change="handleChangeCreativeDate">
              </el-date-picker>
            </el-form-item>
            <el-form-item label="审批通过时间">
              <el-date-picker
                size="mini"
                v-model="creativeQueryForm.beginAuditDate"
                type="date"
                value-format="yyyy-MM-dd"
                placeholder="包含此时间以后的记录">
              </el-date-picker>
            </el-form-item>
            <el-form-item label="状态">
              <el-select v-model="creativeQueryForm.strStatus" clearable filterable multiple
                         size="mini"
                         placeholder="请选择状态">
                <el-option
                  v-for="item in approvalStatusList"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value">
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item id="clear-button">
              <el-button size="mini" @click="clearEditCreativeQuery">清空</el-button>
              <el-button size="mini" type="primary" id="" @click="()=>{
                this.creativePage.current = 1
                this.getCreativeEditTableData()
              }">查询
              </el-button>
            </el-form-item>
          </el-form>
          <div class="curd-table">
            <div class="table-body">
              <el-table
                ref="createTable"
                :data="creativeTableData"
                tooltip-effect="dark"
                height="calc(100vh - 380px)"
                style="width: 100%"
                v-loading="creativeLoading">
                <el-table-column
                  label="素材">
                  <template v-slot="{row}">
                    <el-tooltip effect="dark" content="点击预览素材" placement="bottom-end">
                      <div style="display: inline-block;cursor: pointer;"
                           :class="row.type == 1?'play-icon':''">
                        <el-image
                          v-if="row.type == 1"
                          style="width: 100px; height: 100px"
                          :src="row.thumbnailUrl"
                          @click="handlePreview(row)"
                        >
                        </el-image>
                        <el-image
                          v-else
                          style="width: 100px; height: 100px"
                          :src="row.creativeUrl"
                          @click="handlePreview(row)"
                          :fit="'cover'">
                        </el-image>
                      </div>
                    </el-tooltip>
                  </template>
                </el-table-column>
                <el-table-column
                  prop="shortId"
                  label="短ID"
                  show-overflow-tooltip>
                </el-table-column>
                <el-table-column
                  prop="localFilename"
                  label="本地文件名"
                  show-overflow-tooltip>
                </el-table-column>
                <el-table-column
                  prop="name"
                  label="素材名称"
                  show-overflow-tooltip>
                </el-table-column>
                <el-table-column
                  prop="type"
                  :formatter="formatterCreativeType"
                  label="类型"
                  show-overflow-tooltip>
                </el-table-column>
                <el-table-column
                  prop="auditTime"
                  label="审批通过时间"
                  show-overflow-tooltip>
                </el-table-column>
                <el-table-column
                  prop="type"
                  label="操作"
                  show-overflow-tooltip>
                  <template slot-scope="scope">
                    <el-button
                      size="mini"
                      type="primary"
                      @click="handleChangeAdCreative(scope.row)">更换
                    </el-button>
                  </template>
                </el-table-column>
              </el-table>
            </div>
            <div class="bottom-page clearfix">
              <el-pagination
                background
                @size-change="handleEditCreativeSizeChange"
                @current-change="handleEditCreativeCurrentChange"
                :current-page="creativePage.currentPage"
                :page-sizes="[10, 20, 30, 40, 50, 100]"
                :page-size="creativePage.pageSize"
                layout="total, sizes, prev, pager, next, jumper"
                :total="creativeTotal">
              </el-pagination>
            </div>
          </div>
        </div>
        <el-button slot="bottom" size="mini" @click="editFromStroeDrawer=false">取消</el-button>
      </cs-drawer-container>
    </el-drawer>
    <el-drawer
      title="编辑推广系列"
      :visible="showEditCampaign"
      :modal-append-to-body="false"
      :close-on-click-modal="false"
      :wrapperClosable="false"
      @close="closeSingleEditCampaign"
      size="40%"
    >
      <cs-drawer-container>
        <div class="creative-drawer-box">
          <el-form label-position="top" label-width="80px" :model="singleEditCampaignForm"
                   :rules="singleEditCampaignFormRules"
                   ref="singleEditCampaignForm" v-loading="singleEditCampLoading">
            <basic-container>
              <basic-container>
                <div slot="header" class="card-header">
                  <div class="detail-top">
                    <div>广告账户</div>
                  </div>
                </div>
                <el-form-item>
                  <div>
                    <el-switch
                      v-model="singleEditCampaignForm.ios14Camppaign"
                      :active-color="activeColor"
                      :inactive-color="inactiveColor"
                      id="campaignForm-ios14-1"
                      active-text="使用 iOS 14 专属推广系列"
                      inactive-text=""
                      disabled
                    >
                    </el-switch>
                  </div>
                  <div>
                    <el-switch
                      v-model="singleEditCampaignForm.campaignAppProfilePageState"
                      :active-color="activeColor"
                      :inactive-color="inactiveColor"
                      active-text="使用应用介绍页优化投放"
                      inactive-text=""
                      active-value="ON"
                      inactive-value="OFF"
                      disabled
                    >
                    </el-switch>
                  </div>
                </el-form-item>
              </basic-container>
              <basic-container ref="edit-1-1">
                <div slot="header" class="card-header">
                  <div class="detail-top">
                    <div>推广目标</div>
                  </div>
                </div>
                <el-form-item>
                  <div class="promotion-target-card"
                       :class="{'current-promotion':singleEditCampaignForm.objectiveType==='APP_INSTALL'}"
                       @click="singleEditCampaignForm.objectiveType='APP_INSTALL'">
                    <div class="promotion-target-card-title">
                      <i class="el-icon-mobile-phone">应用推广</i>
                    </div>
                    <div class="promotion-target-card-content">
                      让更多用户安装并使用您的应用。
                    </div>
                  </div>
                </el-form-item>
              </basic-container>
              <basic-container ref="edit-1-2">
                <div slot="header" class="card-header">
                  <div class="detail-top">
                    <div>推广系列类型</div>
                  </div>
                </div>
                <el-form-item label="">
                  <div>
                    <el-radio v-model="singleEditCampaignForm.campaignType" :label="'REGULAR_CAMPAIGN'">应用推广</el-radio>
                    <div class="row-tips">
                      让新用户安装您的应用
                    </div>
                  </div>
                  <div>
                    <el-radio v-model="singleEditCampaignForm.campaignType" :label="'temp'" disabled>应用再营销</el-radio>
                  </div>
                  <div class="row-tips">
                    重新吸引现有用户在您的应用中执行操作。iOS 14.5+ 设备不支持应用再营销。
                  </div>
                </el-form-item>
              </basic-container>
              <basic-container ref="edit-1-3">
                <div slot="header" class="card-header">
                  <div class="detail-top">
                    <div>设置</div>
                  </div>
                </div>
                <el-form-item label="推广系列名称" prop="campaignName">
                  <el-input size="mini" v-model="singleEditCampaignForm.campaignName" placeholder="请输入内容"></el-input>
                </el-form-item>
                <el-form-item label="">
                  <el-switch
                    v-model="singleEditCampaignForm.comparison"
                    :active-color="activeColor"
                    :inactive-color="inactiveColor"
                    active-text="创建拆分对比测试"
                    inactive-text=""
                    disabled>
                  </el-switch>
                  <div class="row-tips"></div>
                </el-form-item>
                <el-form-item label="">
                  <el-switch
                    v-model="singleEditCampaignForm.budgetOptimizeSwitch"
                    :active-color="activeColor"
                    :inactive-color="inactiveColor"
                    active-text="推广系列预算优化"
                    inactive-text=""
                    :active-value="1"
                    :inactive-value="0"
                    disabled>
                  </el-switch>
                  <div class="row-tips">系统自动优化预算分配，广告组不可在设置预算</div>
                </el-form-item>
                <el-form-item label="">
                  <el-switch
                    v-model="singleEditCampaignForm.budgetSwitch"
                    :active-color="activeColor"
                    :inactive-color="inactiveColor"
                    active-text="设置推广系列预算"
                    inactive-text=""
                    :disabled="enableSwitchBudgetSingleCampaign"
                    @change="handleEditSingleCampaignBudgetSwitch">
                  </el-switch>
                  <div class="row-tips">系统自动优化预算分配，广告组不可在设置预算</div>
                </el-form-item>
                <el-collapse-transition>
                  <div v-show="singleEditCampaignForm.budgetOptimizeSwitch === 1||singleEditCampaignForm.budgetSwitch">
                    <el-form-item label="预算" prop="budget">
                      <el-input placeholder="50.00以上" size="mini" v-model="singleEditCampaignForm.budget"
                                class="input-with-select"
                                oninput="if(isNaN(value)){value=null} if(value.indexOf(0) === 0 && value.charAt(1) !== '.'){value=0} if(value.indexOf('.')>0){value=value.slice(0,value.indexOf('.')+3)}">
                        <el-select style="width: 100px" v-model="singleEditCampaignForm.budgetMode" slot="prepend"
                                   placeholder="请选择"
                                   :disabled="enableSwitchBudgetModeSgCamp">
                          <el-option v-for="item in budgetModeList" :key="item.value" :label="item.label"
                                     :value="item.value"></el-option>
                        </el-select>
                        <template slot="append">USD</template>
                      </el-input>
                    </el-form-item>
                  </div>
                </el-collapse-transition>
                <el-collapse-transition>
                  <div v-show="singleEditCampaignForm.budgetOptimizeSwitch === 1">
                    <el-form-item label="竞价策略">
                      <div class="row-tips">最低成本</div>
                    </el-form-item>
                    <el-form-item label="投放速度">
                      <div class="row-tips">标准</div>
                    </el-form-item>
                  </div>
                </el-collapse-transition>
              </basic-container>
            </basic-container>
            <div class="drawer__content">
              <div class="drawer__footer" id="drawer__footer-1">
                <el-button type="primary" @click="submitSingleEditCamp">提交修改</el-button>
              </div>
            </div>
          </el-form>
        </div>
      </cs-drawer-container>
    </el-drawer>
    <el-drawer
      title="编辑广告组"
      :visible="showEditSingleAdGroup"
      :modal-append-to-body="false"
      :close-on-click-modal="false"
      :wrapperClosable="false"
      @close="closeSingleEditSingleAdGroup"
      size="46%"
    >
      <ad-group-form :options="adGroupForm"
                     :current-account-id="adGroupForm.platformId"
                     :is-edit="true"
                     :is-success="adGroupForm.ttAdgroupId !== ''"
                     ref="editAdGroupForm"
                     v-if="showEditSingleAdGroup"
      >
      </ad-group-form>
      <div class="drawer__content">
        <div class="drawer__footer " id="drawer__footer-2 ">
          <el-button type="primary" @click="submitSingleEditADG" v-loading="singleEditAdGroupButtonLoading">提交修改
          </el-button>
        </div>
      </div>
    </el-drawer>
    <el-drawer
      title="编辑广告"
      :visible="showEditAds"
      :modal-append-to-body="false"
      :close-on-click-modal="false"
      :wrapperClosable="false"
      :append-to-body="false"
      :modal="false"
      @close="closeSingleEditAd"
      size="46%"
    >
      <cs-drawer-container>
        <div class="creative-drawer-box">
          <el-form label-position="top" label-width="80px" :model="singleEditAdForm" :rules="singleEditAdFormRules"
                   ref="singleEditAdForm" v-loading="singleEditAdLoading">
            <basic-container ref="3-1">
              <div slot="header" class="card-header">
                <div class="detail-top">
                  <div>广告名称</div>
                </div>
              </div>
              <el-form-item label="" prop="adName">
                <el-input size="mini" v-model="singleEditAdForm.adName" placeholder="请输入内容"></el-input>
              </el-form-item>
            </basic-container>
            <basic-container ref="3-2">
              <div slot="header" class="card-header">
                <div class="detail-top">
                  <div>广告发布者身份</div>
                </div>
              </div>
              <el-form-item label="">
                <el-switch
                  v-model="singleEditAdForm.sparkAdsSwitch"
                  :active-color="activeColor"
                  :inactive-color="inactiveColor"
                  disabled
                  active-text="使用 TikTok 账号投放 Spark Ads "
                  inactive-text="">
                </el-switch>
                <div class="row-tips">申请使用 TikTok 账号个人帖子的权限，然后使用该账号的身份投放广告。</div>
              </el-form-item>
              <el-form-item>
                <template v-if="isACO">
                  <el-select size="mini" v-model="editAdIdentityId" placeholder="请选择身份"
                             :disabled="editIdentityListLoading">
                    <el-option
                      v-for="item in identityList"
                      :key="item.identityId"
                      :label="item.displayName"
                      :value="item.identityId">
                      <span style="float: left"><el-avatar :size="30" :src="item.identityIcon"></el-avatar></span>
                      <span style="float: right"> {{ item.displayName }}
                      </span>
                    </el-option>
                    <div slot="prefix" style="line-height: 34px;">
                      <el-image
                        style="width: 20px; height: 20px;vertical-align: middle"
                        :src="identityIconUrl(editAdIdentityId)"
                        fit="contain"></el-image>
                    </div>
                  </el-select>
                </template>
                <template v-else>
                  <el-select size="mini" v-model="editAdIdentityId" placeholder="请选择身份"
                             :disabled="editIdentityListLoading">
                    <el-option
                      v-for="item in identityList"
                      :key="item.id"
                      :label="item.displayName"
                      :value="item.id">
                      <span style="float: left"><el-avatar :size="30" :src="item.identityIcon"></el-avatar></span>
                      <span style="float: right"> {{ item.displayName }}
                      </span>
                    </el-option>
                    <div slot="prefix" style="line-height: 34px;">
                      <el-image
                        style="width: 20px; height: 20px;vertical-align: middle"
                        :src="identityIconUrl(editAdIdentityId)"
                        fit="contain"></el-image>
                    </div>
                  </el-select>
                </template>
                <el-button style="margin-left: 5px" type="text" icon="el-icon-refresh-right"
                           @click="getEditIdentityList(true, singleEditAdForm.adGroupId, singleEditAdForm.appId)"
                           v-loading="editIdentityListLoading"></el-button>
              </el-form-item>
              <el-form-item>
                <el-button size="mini" type="text" icon="el-icon-plus" @click="addIdentityDialog = true">添加自定义身份
                </el-button>
                <el-dialog
                  title="添加自定义身份名称"
                  :visible.sync="addIdentityDialog"
                  :close-on-click-modal="false"
                  :modal-append-to-body="false"
                  :modal="false"
                  width="300px">
                  <el-form :model="identityForm" ref="identityForm" label-width="0px" @submit.native.prevent>
                    <el-form-item
                      prop="value"
                      :rules="[{ required: true, message: '身份名称不能为空',trigger: 'blur'}]"
                    >
                      <el-upload
                        style="display:inline-block;"
                        class="identity-upload"
                        action="#"
                        :http-request="uploadQiniuCloud"
                        :before-upload="beforeAvatarUpload"
                        :show-file-list="false"
                        list-type="picture">
                        <el-avatar :size="50" :src="logoUrl" :key="logoUrl"></el-avatar>
                      </el-upload>
                      &nbsp;
                      <el-input v-model="identityForm.value" style="width: 75%"></el-input>
                    </el-form-item>
                  </el-form>
                  <span slot="footer" class="dialog-footer">
    <el-button @click="addIdentityDialog = false">取 消</el-button>
    <el-button type="primary" @click="addEditIdentity" v-loading="addIdentityLoading">确 定</el-button>
  </span>
                </el-dialog>
              </el-form-item>
            </basic-container>
            <basic-container ref="3-3">
              <div slot="header" class="card-header">
                <div class="detail-top">
                  <div>创意素材</div>
                </div>
              </div>
              <template v-if="isACO">
                <aco-ad-edit
                  :creatives="singleEditAdForm.acoCreatives"
                  :docs="singleEditAdForm.acoAdTexts"
                  :ctas="singleEditAdForm.acoCTAs"
                  :call-to-action-list="callToActionList"
                  :call-to-action-type.sync="singleEditAdForm.callToActionType"
                  :text-data="textData"
                  :is-edit="true"
                  :offer-id="offerId"
                  :account-id="singleEditAdForm.platformId"
                  @changeAcoCreatives="changeAcoCreatives"
                  @changeCTAVals="changeCTAVals"
                  @changeDocs="changeDocs"
                  @changeCoverMap="changeEditAcoCoverMap"
                  ref="acoEditDrawer"
                ></aco-ad-edit>
              </template>
              <template v-else>
                <el-form-item :label="singleEditAdForm.adFormat==='SINGLE_VIDEO'?'视频':'图片'">
                  <template v-if="singleEditAdForm.adFormat==='SINGLE_VIDEO'">
                    <div style="display: flex">
                      <div style="margin-right: 15px;cursor: pointer">
                        <el-image :src="EditAdCreatives.thumbnailUrl"
                                  @click="handlePreview(EditAdCreatives)" style="width: 200px;height: 200px"/>
                      </div>
                      <div>
                        <el-button type="text" icon="el-icon-edit"
                                   @click="handleOpenEditCreative">更新
                        </el-button>
                        <el-button type="text" icon="el-icon-picture"
                                   v-if="EditAdCreatives.type == 1"
                                   @click="handleOpenSuggestCover(EditAdCreatives, singleEditAdForm.platformId, 'edit')">
                          视频封面
                        </el-button>
                      </div>
                    </div>
                  </template>
                  <template v-else>
                    <div style="display: flex;cursor: pointer">
                      <div>
                        <el-image :src="EditAdCreatives.creativeUrl"
                                  @click="handlePreview(EditAdCreatives)" style="width: 200px;height: 200px"
                                  v-if="EditAdCreatives.creativeUrl !== undefined"/>
                      </div>
                      <div>
                        <el-button type="text" icon="el-icon-edit"
                                   @click="handleOpenEditCreative">更新
                        </el-button>
                      </div>
                    </div>
                  </template>
                </el-form-item>
                <el-form-item label="广告文案">
                  <div>
                    <i class="el-icon-circle-plus-outline" style="color: #34acff;font-size: 15px;cursor:pointer;"
                       @click="showTextEditSelection()"></i>
                    <span style="margin-left: 5px;color:#34acff;cursor:pointer;"
                          @click="showTextEditSelection()" id="circle-plus-outline-edit-ad">从文案库选择文案</span>
                  </div>
                  <docs-single-select-drawer v-if="visibleDocs"
                                             :visible-docs.sync="visibleDocs"
                                             :offer-id="offerId"
                                             @updateFormalAdText="updateFormalAdText"
                  >
                  </docs-single-select-drawer>
                  <el-autocomplete
                    style="width: 500px;"
                    size="mini"
                    v-model="singleEditAdForm.adText"
                    :fetch-suggestions="queryCreativeTextSearch"
                    placeholder="请输入内容"
                  ></el-autocomplete>
                </el-form-item>
                <el-form-item label="">
                  <el-radio v-model="singleEditAdForm.callToActionType" label="1">动态优选</el-radio>
                  <el-radio v-model="singleEditAdForm.callToActionType" label="0">标准</el-radio>
                  <el-collapse-transition>
                    <div v-show="singleEditAdForm.callToActionType === '0'">
                      <el-select v-model="singleEditAdForm.callToAction" placeholder="请选择" size="mini">
                        <el-option v-for="item in callToActionList"
                                   :key="item.value"
                                   :label="item.label"
                                   :value="item.value">
                        </el-option>
                      </el-select>
                    </div>
                  </el-collapse-transition>
                </el-form-item>
              </template>
            </basic-container>
            <basic-container ref="3-5" v-if="singleEditAdForm.campaignAppProfilePageState ==='ON'">
              <div slot="header" class="card-header">
                <div class="detail-top">
                  <div>目标页</div>
                </div>
              </div>
              <el-form-item label="应用介绍页" prop="pageId" ref="ad-pageId">
                <el-select size="mini" v-model="singleEditAdForm.pageId" placeholder="请选择应用介绍页"
                           @change="handleEditChangeLandingPage">
                  <el-option
                    v-for="item in landingPageList"
                    :key="item.value"
                    :label="item.label+'  ID:'+item.value"
                    :value="item.value">
                  </el-option>
                </el-select>
                <el-button style="margin-left: 5px" type="text" icon="el-icon-refresh-right"
                           @click="getLandingPageList" v-loading="landingPageLoading"></el-button>
                <div>
                  <el-image
                    v-show="singleEditAdForm.pageId !== ''"
                    style="width: 100px; height: 180px"
                    :src="singleEditAdForm.thumbnailUrl"
                    fit="cover"></el-image>
                </div>
              </el-form-item>
            </basic-container>
            <basic-container ref="3-4">
              <div slot="header" class="card-header">
                <div class="detail-top">
                  <div>检测</div>
                </div>
              </div>
              第三方监测设置
              <el-form-item label="展现监测URL">
                <el-input size="mini" v-model="singleEditAdForm.impressionTrackingUrl"></el-input>
              </el-form-item>
              <el-form-item label="点击监测URL">
                <el-input size="mini" v-model="singleEditAdForm.clickTrackingUrl" disabled></el-input>
              </el-form-item>
            </basic-container>
            <div class="drawer__content">
              <div class="drawer__footer">
                <el-button type="primary"
                           @click="submitEditAds">提交修改
                </el-button>
              </div>
            </div>
          </el-form>
        </div>
      </cs-drawer-container>
    </el-drawer>
    <!--批量修改广告组预算-->
    <el-drawer
      title="批量修改预算"
      :visible="showBatchUpdateBudget"
      :modal-append-to-body="false"
      :close-on-click-modal="false"
      :wrapperClosable="false"
      @close="closeBatchUpdateBudget"
      size="50%"
    >
      <template>
        <div class="drawer__content">
          <el-form v-model="batchUpdateAdgroupBudgetForm" inline>
            <el-form-item style="width: 150px;">
              <el-select v-model="batchUpdateAdgroupBudgetForm.changeMethod" @change="renderBCAdgroupBudgetTable"
                         style="width: 100%">
                <el-option v-for="item in bcUpdateBudgetChangeMethod"
                           :label="item.label"
                           :value="item.value"
                           :key="item.value"
                />
              </el-select>
            </el-form-item>
            <el-form-item style="width: 150px;">
              <el-input v-model="batchUpdateAdgroupBudgetForm.amount" @blur="renderBCAdgroupBudgetTable"
                        oninput="if(isNaN(value)){value=null} if(value.indexOf(0) === 0 && value.charAt(1) !== '.'){value=0} if(value.indexOf('.')>0){value=value.slice(0,value.indexOf('.')+3)}"
                        style="width: 100%"/>
            </el-form-item>
            <el-form-item style="width: 70px;">
              <el-select v-model="batchUpdateAdgroupBudgetForm.changeType" @change="renderBCAdgroupBudgetTable"
                         style="width: 100%" :disabled="changeTypeMethodDisable">
                <el-option v-for="item in bcUpdateBudgetChangeTypes"
                           :label="item.label"
                           :value="item.value"
                           :key="item.value"
                />
              </el-select>
            </el-form-item>
          </el-form>
          <template>
            <div v-if="batchUpdateAdGroupBudTips" style="color:red">*日预算不能低于20,总预算不能低于选定日期 * 20,已为你已改为至最低预算</div>
            <div v-if="batchUpdateAdGroupNegTips" style="color:red">*数值不能为负数</div>
          </template>
          <el-table
            :data="adGroupBudgetAllTypeList"
            v-loading="showBatchUpdateBudgetLoading"
            max-height="700px"
          >
            <el-table-column label="广告组名称" prop="adgroupName"/>
            <el-table-column label="所选时间段消耗">
              <template slot-scope="{row}">
                ${{ row.spend }}
              </template>
            </el-table-column>
            <el-table-column label="预算类型" prop="budgetMode">
              <template slot-scope="{row}">
                {{ row.budgetMode === 'BUDGET_MODE_DAY' ? '日预算' : '总预算' }}
              </template>
            </el-table-column>
            <el-table-column label="预算" prop="budget">
              <template slot-scope="{row}">
                ${{ row.budget }}
              </template>
            </el-table-column>
            <el-table-column label="最新预算" prop="newBudget" width="200px">
              <template slot-scope="{row}">
                <template v-if="row.editable">
                  <div>
                    <el-input v-model="row.newBudget" style="width:100%"
                              oninput="if(isNaN(value)){value=null} if(value.indexOf(0) === 0 && value.charAt(1) !== '.'){value=0} if(value.indexOf('.')>0){value=value.slice(0,value.indexOf('.')+3)}"
                              @blur="renderSingleBCAdgroupBudgetTable(row)">
                      <template slot="append">USD</template>
                    </el-input>
                  </div>
                </template>
                <template v-else>
                  不可修改
                </template>
              </template>
            </el-table-column>
          </el-table>
          <div class="drawer__footer">
            <el-button type="primary" @click="submitBatchUpdateAdGroupBudget" style="margin: 10px"
                       v-loading="batchUpdateAdGroupBudgetLoading" :disabled="batchUpdateAdGroupBudgetDisabled">提交修改
            </el-button>
          </div>
        </div>
      </template>
    </el-drawer>


    <el-drawer
      title="批量修改预算"
      :visible="showBatchUpdateCampBudget"
      :modal-append-to-body="false"
      :close-on-click-modal="false"
      :wrapperClosable="false"
      @close="closeBatchUpdateCampBudget"
      size="50%"
    >
      <template>
        <div class="drawer__content">
          <el-form v-model="batchUpdateAdgroupBudgetForm" inline>
            <el-form-item style="width: 150px">
              <el-select v-model="batchUpdateAdgroupBudgetForm.changeMethod" @change="renderBCBudgetTable"
                         style="width:100%">
                <el-option v-for="item in bcUpdateBudgetChangeMethod"
                           :label="item.label"
                           :value="item.value"
                           :key="item.value"
                />
              </el-select>
            </el-form-item>
            <el-form-item style="width: 150px">
              <el-input v-model="batchUpdateAdgroupBudgetForm.amount" @blur="renderBCBudgetTable"
                        oninput="if(isNaN(value)){value=null} if(value.indexOf(0) === 0 && value.charAt(1) !== '.'){value=0} if(value.indexOf('.')>0){value=value.slice(0,value.indexOf('.')+3)}"
                        style="width:100%"/>
            </el-form-item>
            <el-form-item style="width: 70px">
              <el-select v-model="batchUpdateAdgroupBudgetForm.changeType" @change="renderBCBudgetTable"
                         style="width:100%" :disabled="changeTypeMethodDisable">
                <el-option v-for="item in bcUpdateBudgetChangeTypes"
                           :label="item.label"
                           :value="item.value"
                           :key="item.value"
                />
              </el-select>
            </el-form-item>
          </el-form>
          <template>
            <div v-if="batchUpdateCampBudTips" style="color: red">*广告系列预算必须在$50 ~ $10000000之间,已为你设置为最低预算</div>
            <div v-if="batchUpdateCampNegTips" style="color: red">*数值不能为负数</div>
          </template>
          <el-table
            :data="campUpdateBudgetList"
            v-loading="showBatchUpdateCampBudgetLoading"
            max-height="700px"
          >
            <el-table-column label="推广系列名称" prop="campaignName"/>
            <el-table-column label="所选时间段消耗">
              <template slot-scope="{row}">
                ${{ row.spend }}
              </template>
            </el-table-column>
            <el-table-column label="预算类型" prop="budgetMode">
              <template slot-scope="{row}">
                {{
                  row.budgetMode === 'BUDGET_MODE_DAY' ? '日预算' : row.budgetMode === 'BUDGET_MODE_TOTAL' ? '总预算' : '不限'
                }}
              </template>
            </el-table-column>
            <el-table-column label="预算" prop="budget">
              <template slot-scope="{row}">
                ${{ row.budget }}
              </template>
            </el-table-column>
            <el-table-column label="最新预算" prop="newBudget" width="200px">
              <template slot-scope="{row}">
                <template v-if="row.editable">
                  <div>
                    <el-input v-model="row.newBudget" style="width:100%"
                              oninput="if(isNaN(value)){value=null} if(value.indexOf(0) === 0 && value.charAt(1) !== '.'){value=0} if(value.indexOf('.')>0){value=value.slice(0,value.indexOf('.')+3)}"
                              @blur="renderSingleBCBudgetTable(row)">
                      <template slot="append">USD</template>
                    </el-input>
                  </div>
                </template>
                <template v-else>
                  不可修改
                </template>
              </template>
            </el-table-column>
          </el-table>
          <div class="drawer__footer" id="drawer__footer-6">
            <el-button type="primary" @click="submitBatchUpdateCampBudget" style="margin: 10px"
                       v-loading="batchUpdateCampBudgetLoading" :disabled="batchUpdateCampBudgetDisabled">提交修改
            </el-button>
          </div>
        </div>
      </template>
    </el-drawer>

    <el-drawer
      title="批量修改出价"
      :visible="showBatchUpdateBid"
      :modal-append-to-body="false"
      :close-on-click-modal="false"
      :wrapperClosable="false"
      @close="closeBatchUpdateBid"
      size="50%"
    >
      <div>
        <div class="drawer__content">
          <el-form v-model="batchUpdateAdgroupBudgetForm" inline>
            <el-form-item style="width: 150px">
              <el-select v-model="batchUpdateAdgroupBudgetForm.changeMethod" @change="renderBCAdgroupBidTable"
                         style="width:100%">
                <el-option v-for="item in bcUpdateBidChangeMethod"
                           :label="item.label"
                           :value="item.value"
                           :key="item.value"
                />
              </el-select>
            </el-form-item>
            <el-form-item style="width: 200px">
              <el-input v-model="batchUpdateAdgroupBudgetForm.amount" @blur="renderBCAdgroupBidTable"
                        oninput="if(isNaN(value)){value=null} if(value.indexOf(0) === 0 && value.charAt(1) !== '.'){value=0} if(value.indexOf('.')>0){value=value.slice(0,value.indexOf('.')+3)} if(value.contains('-')){value = 0}"
                        style="width:100%"/>
            </el-form-item>
            <el-form-item style="width:70px">
              <el-select v-model="batchUpdateAdgroupBudgetForm.changeType" @change="renderBCAdgroupBidTable"
                         style="width:100%" :disabled="changeTypeMethodDisable">
                <el-option v-for="item in bcUpdateBudgetChangeTypes"
                           :label="item.label"
                           :value="item.value"
                           :key="item.value"
                />
              </el-select>
            </el-form-item>
            <template v-show="batchUpdateBidTips">
              <div v-if="batchUpdateBidTips" style="color: red">*出价不能低于0或大于预算,已为你修改至最低价或原价</div>
              <div v-if="batchUpdateNegTips" style="color: red">*数值不能为负数</div>
            </template>
          </el-form>
          <el-table
            :data="adGroupUpdateBidList"
            v-loading="showBatchUpdateBidLoading"
            max-height="700px"
          >
            <el-table-column label="广告组名称" prop="adgroupName"/>
            <el-table-column label="所选时间段消耗">
              <template slot-scope="{row}">
                ${{ row.spend }}
              </template>
            </el-table-column>
            <el-table-column label="出价类型" prop="bidType">
              <template slot-scope="{row}">
                {{ row.billingEvent }}
              </template>
            </el-table-column>
            <el-table-column label="出价" prop="budget">
              <template slot-scope="{row}">
                ${{ row.bidPrice }}({{ getOpGoalName(row.optimizationGoal) }})
              </template>
            </el-table-column>
            <el-table-column label="新的出价" prop="newBudget" width="200px">
              <template slot-scope="{row}">
                <template v-if="row.editable">
                  <div>
                    <el-input v-model="row.newBidPrice" style="width:100%"
                              oninput="if(isNaN(value)){value=null} if(value.indexOf(0) === 0 && value.charAt(1) !== '.'){value=0} if(value.indexOf('.')>0){value=value.slice(0,value.indexOf('.')+3)} if(value.contains('-')){value = 0}"
                              @blur="renderSingleBCAdgroupBidTable(row)">
                      <template slot="append">USD</template>
                    </el-input>
                  </div>
                </template>
                <template v-else>
                  不可修改
                </template>
              </template>
            </el-table-column>
          </el-table>
          <div class="drawer__footer" id="drawer__footer-4">
            <el-button type="primary" @click="submitBatchUpdateAdGroupBidConfirm" style="margin:10px"
                       v-loading="batchUpdateAdGroupBidLoading" :disabled="batchUpdateAdGroupBidDisabled">提交修改
            </el-button>
          </div>
        </div>
      </div>
    </el-drawer>

    <el-drawer
      title="批量修改广告组名称"
      :visible="showBatchUpdateAdGroupName"
      :modal-append-to-body="false"
      :close-on-click-modal="false"
      :wrapperClosable="false"
      @close="closeBatchUpdateAdgroupNames"
      size="50%"
    >
      <div>
        <div class="drawer__content">
          <el-table
            :data="adGroupUpdateNames"
            v-loading="showBatchUpdateAdGroupNameLoading"
            max-height="700px"
          >
            <el-table-column label="广告组名称" prop="adgroupName" width="300"/>
            <el-table-column label="所选时间段消耗" width="150">
              <template slot-scope="{row}">
                ${{ row.spend }}
              </template>
            </el-table-column>
            <el-table-column label="新的广告组名称" prop="newAdgroupName">
              <template slot-scope="{row, column, $index}">
                <div>
                  <el-input :ref="'batchEditInput'+$index" type="text" v-model="row.newAdgroupName" style="width:100%">
                  </el-input>
                </div>
              </template>
            </el-table-column>
          </el-table>
          <div class="drawer__footer">
            <el-button type="primary" v-loading="batchUpdateNameBtnLoading" @click="submitBatchUpdateAdGroupNames">
              提交修改
            </el-button>
          </div>
        </div>
      </div>
    </el-drawer>

    <el-drawer
      title="批量修改推广系列名称"
      :visible="showBatchUpdateCampNames"
      :modal-append-to-body="false"
      :close-on-click-modal="false"
      :wrapperClosable="false"
      @close="closeBatchUpdateCampNames"
      size="50%"
    >
      <div>
        <div class="drawer__content">
          <el-table
            :data="campUpdateNames"
            v-loading="showBatchUpdateCampBudgetLoading"
            max-height="700px"
          >
            <el-table-column label="推广系列名称" prop="campaignName" width="300"/>
            <el-table-column label="所选时间段消耗" width="150">
              <template slot-scope="{row}">
                ${{ row.spend }}
              </template>
            </el-table-column>
            <el-table-column label="新的推广系列名称" prop="newBudget">
              <template slot-scope="{row}" v-if="row.editable">
                <div>
                  <el-input type="text" v-model="row.newCampName" style="width:100%">
                  </el-input>
                </div>
              </template>
              <template v-else>
                不可修改
              </template>
            </el-table-column>
          </el-table>
          <div class="drawer__footer">
            <el-button type="primary" v-loading="batchUpdateNameBtnLoading" @click="submitBatchUpdateCampNames"
                       style="margin:10px">
              提交修改
            </el-button>
          </div>
        </div>
      </div>
    </el-drawer>
    <el-drawer
      title="选择文案"
      :visible.sync="creativeTextSelection"
      :modal-append-to-body="false"
      :close-on-click-modal="false"
      :wrapperClosable="false"
      :before-close="handleTextSelectionClose"
      size="60%"
    >
      <el-divider></el-divider>
      <div>
        <!--                       @input="searchCreativeText"-->
        <el-row style="margin-left: 10px;margin-right: 10px">
          <el-col :span="18">
            <el-input v-model="textSearchData" style="width:100%"
                      @input="searchCreativeText"
                      placeholder="请输入要搜索的内容"></el-input>
          </el-col>
          <el-col :span="6">
            <div style="color:#72767b; margin-left: 50px;margin-top: 8px;font-size: 14px">
              已选中 <span style="font-size: 20px; color:#00a680 !important;">{{ textSelectData.length }}</span> 个文案
            </div>
          </el-col>
        </el-row>
        <div class="drawer__content">
          <el-table
            ref="multipleTable"
            row-key="id"
            :data="filterTextData"
            @selection-change="handleTextSelectionChange"
          >
            <el-table-column type="selection" width="55" :reserve-selection="true"/>
            <el-table-column label="广告文案" prop="text" width="200"/>
            <el-table-column label="语言" prop="language"/>
            <el-table-column label="投放媒体" prop="platform"/>
            <el-table-column label="解释" prop="description" width="200"/>
          </el-table>
          <div class="bottom-page clearfix">
            <el-pagination
              @current-change="handleTextCurrentChange"
              :current-page="textPage.current"
              :page-sizes="[textPage.pageSize]"
              :page-size="textPage.pageSize"
              layout="total, sizes, prev, pager, next, jumper"
              :total="searchTextData.length">
            </el-pagination>
          </div>
          <div class="drawer__footer">
            <el-button type="primary" @click="confirmTextSelection" style="margin:10px">确定</el-button>
          </div>
        </div>
      </div>
    </el-drawer>
    <el-dialog
      title="修改推广系列信息"
      :visible.sync="errCampTableShow"
      :modal-append-to-body="false"
      :close-on-click-modal="false"
      :wrapperClosable="false"
      @close="closeErrCampTable"
    >
      <el-table :data="errCampTable">
        <el-table-column prop="ttCampaignId" label="推广系列ID"/>
        <el-table-column prop="success" label="修改状态">
          <template slot-scope="{row}">
            <span style="color:green" v-if="row.success === 'true'">成功</span>
            <span style="color:red" v-else>失败</span>
          </template>
        </el-table-column>
        <el-table-column prop="msg" label="错误信息"/>
      </el-table>
    </el-dialog>
    <el-dialog
      title="修改广告组信息"
      :visible.sync="errAdGroupTableShow"
      :modal-append-to-body="false"
      :close-on-click-modal="false"
      :wrapperClosable="false"
      @close="closeErrAdGroupTable"
    >
      <el-table :data="errAdGroupTable">
        <el-table-column prop="ttAdgroupId" label="广告组ID"/>
        <el-table-column prop="success" label="修改状态">
          <template slot-scope="{row}">
            <span style="color:green" v-if="row.success === 'true'">成功</span>
            <span style="color:red" v-else>失败</span>
          </template>
        </el-table-column>
        <el-table-column prop="msg" label="错误信息"/>
      </el-table>
    </el-dialog>
    <el-dialog
      title="修改广告信息"
      :visible.sync="errAdTableShow"
      :modal-append-to-body="false"
      :close-on-click-modal="false"
      :wrapperClosable="false"
      @close="closeErrAdTable"
    >
      <el-table :data="errAdTable">
        <el-table-column prop="ttAdId" label="广告ID"/>
        <el-table-column prop="success" label="修改状态">
          <template slot-scope="{row}">
            <span style="color:green" v-if="row.success === 'true'">成功</span>
            <span style="color:red" v-else>失败</span>
          </template>
        </el-table-column>
        <el-table-column prop="msg" label="错误信息"/>
      </el-table>
    </el-dialog>
    <el-dialog title="修改广告组定向"
               :visible.sync="showAdGroupTargeting"
               :modal-append-to-body="false"
               :close-on-click-modal="false"
               :wrapperClosable="false"
               width="80%"
               @close="closeAdGroupTargeting">
      <batch-update-ad-group-targeting v-if="showAdGroupTargeting"
                                       :ad-groups="adGroupTargets"
                                       :visible.sync="showAdGroupTargeting"
                                       @callbackErrAdGroupTable="callbackErrAdGroupTable"
      >

      </batch-update-ad-group-targeting>
    </el-dialog>
    <creative-card-preview v-model="assetPreview" :media-preview="previewCreative">
    </creative-card-preview>
    <batch-campaign-confirm
      :visible.sync="batchUpdateCampaignStatusShow"
      v-if="batchUpdateCampaignStatusShow"
      :data-list="batchDialogCampName"
      :title="batchCampaignTitle"
      :status="batchCampaignStatus"
      @callbackBatchCampaignOps="callbackBatchCampaignOps"
    >
    </batch-campaign-confirm>
    <batch-ad-group-confirm
      :visible.sync="batchUpdateAdGroupStatusShow"
      v-if="batchUpdateAdGroupStatusShow"
      :data-list="batchDialogAdGroupName"
      :title="batchAdGroupTitle"
      :status="batchAdGroupStatus"
      @callbackBatchAdGroupOps="callbackBatchAdGroupOps"
    >
    </batch-ad-group-confirm>
    <batch-ad-confirm
      :visible.sync="batchUpdateAdStatusShow"
      v-if="batchUpdateAdStatusShow"
      :data-list="batchDialogAdName"
      :title="batchAdTitle"
      :contain-aco="containACO"
      :status="batchAdStatus"
      @callbackBatchAdOps="callbackBatchAdOps"
    >
    </batch-ad-confirm>
    <suggest-cover :visible.sync="openSuggestCover"
                   v-if="openSuggestCover"
                   :creative="suggestCreative"
                   :account-id="suggestCoverAccount"
                   @returnCoverId="returnCoverId"
    ></suggest-cover>
  </div>
</template>

<script>
import CsFilterQuery from "@/components/CsFilterQuery/CsFilterQuery";
import {getActiveAccountList, getAppList, refreshAppList} from "../../api/campaign/campaign";
import CampaignTasks from "@/views/campaign-management/components/CampaignTasks";
import CsDrawerContainer from "@/components/CsDrawerContainer/CsDrawerContainer";
import CreativeCardPreview from "../../components/CreativeCardPreview/CreativeCardPreview";
import {mapState} from "vuex";
import draggable from "vuedraggable"
import {getCallToActionList, getLanguagesList, getLocationList, getTtStatus} from "@/util/beetles"
import {
  batchUpdateAdgroupBid,
  batchUpdateAdGroupBudget,
  batchUpdateAdgroupNames,
  batchUpdateAdGroupStatus,
  batchUpdateAdStatus,
  batchUpdateCampaignBudget,
  batchUpdateCampaignNames,
  batchUpdateCampaignStatus,
  changeAdGroupStatus,
  changeAdStatus,
  changeCampaignStatus,
  checkAdGroupExist,
  checkAdGroupName,
  checkCampaignName,
  createAdCampaign,
  createBatchAd,
  createBatchAdGroup,
  createTtIdentity,
  createTtIdentityByAdGroup,
  delCustomTtEventTemplate,
  editAcoDetail,
  editAd,
  editSingleAdGroup,
  editSingleCampaign,
  getAccountAppList,
  getAccountListByAppId,
  getAcoDetail,
  getActionCategories,
  getAdAudiencesDataList,
  getAdGroupAudiencesDataList,
  getAdgroupCost,
  getAdGroupList,
  getAdGroupPage, getAdGroupTotalData,
  getAdPage, getAdTotalData,
  getAudiencesInfo,
  getCampaignAudiencesDataList,
  getCampaignCost,
  getCampaignList, getCampaignTotalData,
  getCopyAdgroupDetail,
  getCreators,
  getCustomTtEventTemplate,
  getFormatAdByAdGroup,
  getInterestByKeyword,
  getIos14Quota,
  getLandingPageList,
  getLocationTree,
  getOptimizationEvent,
  getTextList,
  getTiktokAdEventData,
  getTiktokAdGroupEventData,
  getTiktokCampaignEventData,
  getTiktokCampaignPage,
  getTiktokInterestTree,
  getTtIdentity,
  getTtIdentityByAdGroup,
  offerCreativePage,
  saveCustomTtEventTemplate,
  saveTask,
  updateAdgroupBid,
  updateAdgroupBudget,
  updateAdName,
  updateCampaignBudget,
  updateCampaignName,
  updateGroupName,
  getAdCover
} from "@/api/campaign-management/campaign-management";
import _ from 'lodash'
import {getAllUser} from "@/api/user";
import {selectone} from "@/api/offer/creativeperformance"
import Moment from "moment";
import TemplateConf from "../system/components/templateConf";
import {getTTAccountBalance} from "@/api/accountOrTransfer/transfer";
import {deepClone} from "../../util/util";
import CsRadioCheckbox from "@/components/CsRadioCheckbox/CsRadioCheckbox";
import weektimeData from "@/components/DragWeektime/data/weektime_data";
import DragWeektime from "@/components/DragWeektime/DragWeektime";
import * as qiniuTools from "@/util/qinnu_upload";
import beetlesSearch from "@/components/basic-components/beetles-search";
import NProgress from "nprogress";
import CommonCpn from "@/views/campaign-management/components/CommonCpn";
import CreativePull from "@/views/campaign-management/components/CreativePull";
import CampaignClone from "@/views/campaign-management/components/CampaignClone";
import AcoAdEdit from "@/views/campaign-management/components/AcoAdEdit"
import DocsSingleSelectDrawer from "@/views/campaign-management/components/DocsSingleSelectDrawer"
import AdForm from "@/views/campaign-management/components/AdForm";
import AdGroupForm from "@/views/campaign-management/components/AdGroupForm";
import BatchUpdateAdGroupTargeting from "@/views/campaign-management/components/BatchUpdateAdGroupTargeting"
import AdGroupClone from "@/views/campaign-management/components/AdGroupClone";
import BatchAdConfirm from "@/views/campaign-management/components/BatchAdConfirm";
import BatchAdGroupConfirm from "@/views/campaign-management/components/BatchAdGroupConfirm";
import BatchCampaignConfirm from "@/views/campaign-management/components/BatchCampaignConfirm";
import AdClone from "@/views/campaign-management/components/AdClone";
import SuggestCover from "@/views/campaign-management/components/SuggestCover";


// 创建推广系列表单默认值
const campaignForm = {
  // 账户
  platformId: '',
  // 推广系列类型
  campaignType: 'REGULAR_CAMPAIGN',
  // 推广目标
  objectiveType: 'APP_INSTALL',
  // ios14开关
  ios14Camppaign: false,
  campaignAppProfilePageState: false,
  // ios14必填
  appId: '',
  // 推广系列名称
  campaignName: '',
  // 创建拆分对比测试(temp)
  comparison: false,
  // 推广系列预算优化
  budgetOptimizeSwitch: 0,
  // 设置广告广系列预算
  budgetSwitch: false,
  // 预算模式
  budgetMode: '',
  // 预算
  budget: '',
  // app名称
  appName: '',
  // 系统
  os: '',
  platformAppId: '',
  sameCreativesForAdgroup: true,
}
const adGroupForm = {
  // 广告组名称
  adgroupName: '广告组-' + Moment().format("yyyyMMDDHHmmss"),
  // 版位
  placementType: 'PLACEMENT_TYPE_AUTOMATIC',
  // 用户评论开关
  commentDisabled: 1,
  // 视频下载开关（1:开启，0:关闭）
  videoDownloadDisabled: 1,
  shareDisabled: 1,
  // Pangle媒体屏蔽开关（1:开启，0:关闭）
  blockedPangleDisabled: 0,
  // 创意投放方式
  creativeMaterialMode: 'CUSTOM',
  // 自动定向
  autoTargetingEnabled: 0,
  // 批量开关
  batch: true,
  // 预算
  budget: '',
  // 批量类型
  budgetMode: 'BUDGET_MODE_DAY',
  // 对应&组合
  autoCreateType: 1,
  // 排期方式
  scheduleType: 'SCHEDULE_FROM_NOW',
  // 开始时间
  scheduleStartTime: Moment().format("yyyy-MM-DD HH:mm:ss"),
  // 结束时间
  scheduleEndTime: Moment().add(14, "days").format("yyyy-MM-DD HH:mm:ss"),
  // 分时段
  dayparting: 1,
  // 优化目标
  optimizationGoal: 'INSTALL',
  // 优化事件
  optimizationEvent: '',
  // 出价费用
  bidPrice: '',
  // 次日留存率
  dailyRetentionRatio: '',
  // 选择受众
  audienceIds: [],
  // 排除受众
  excludedAudienceIds: [],
  // 家庭收入
  householdIncome: [],
  // 兴趣
  interestCategoryIds: [],
  // 视频互动
  videoRelatedCategoryIds: [],
  // 作者互动
  creatorRelatedCategoryIds: [],
  // 话题互动 (temp)
  // topicInteraction: '',
  // 设备定向扩量
  expansionEnabled: 0,
  // 国家地区 数组
  locationIds: [],
  // 语言
  languages: [],
  // 性别
  gender: 'GENDER_UNLIMITED',
  // 年龄
  age: [],
  // 对应列表
  groupList: [{
    adgroupName: '',
    locationIds: [],
    languages: [],
    gender: 'GENDER_UNLIMITED',
    age: []
  }],
  // 地区组合字段
  locationIdsArr: [[]],
  // 语言组合字段
  languagesArr: [[]],
  // 性别组合字段
  genderArr: ['GENDER_UNLIMITED'],
  // 年龄组合字段
  ageArr: [[]],
  // 竞价策略
  bidType: 'BID_TYPE_NO_BID',
  // 投放速度
  pacing: 'PACING_MODE_SMOOTH',
  // 版位
  placement: ["PLACEMENT_TIKTOK", "PLACEMENT_PANGLE"],
  // 设置广告花费回报(ROAS)下限值
  isSetROAS: false,
  //深度事件出价类型
  deepBidType: '',
  // 用于价值优化的ROAS目标值
  roasBid: '',
  // 定向扩量
  expansionTypes: [],
  // 定向扩量阻止开关
  expansionswitch: false,
  // 视频相关行为
  videoUserAction: {
    VIDEO_RELATED: [],
    CREATOR_RELATED: []
  },
  // 选择n天内发生的行为
  actionPeriod: '',
  creatorRelatedCategory: [],
  videoRelatedCategory: [],
  interestCategory: [],
  interestsByKeyword: [],
  interestsByKeywordIds: [],
  excludedAudience: '',
  audience: '',
  conversionBidPrice: ''
}
const adForm = {
  // Spark Ads
  sparkAdsSwitch: false,
  // 批量
  batch: true,
  // 批量实现类型
  autoCreateType: 1,
  // 素材格式
  adFormat: 'SINGLE_VIDEO',
  // 动态优选
  callToActionType: '1',
  // 展示动态监测
  impressionTrackingUrl: '',
  // 点击监测url
  clickTrackingUrl: '',
  // 发布者身份
  adIdentityId: '',
  adIdentityName: '',

  adList: [{
    // 广告名字
    adName: '',
    adGroup: '',
    // 素材列表
    creativeList: [],
    // 单文案
    word: '',
    // 多文案
    words: [''],
    // 素材格式
    // 批量实现类型
    autoCreateType: 1,
    adFormat: 'SINGLE_VIDEO',
    // 行动引导文案
    callToAction: 'DOWNLOAD_NOW',
    callToActionArr: [],
    // 动态优选
    callToActionType: '1',
    // 发布者身份
    adIdentityId: '',
    adIdentityName: '',
    pageId: '',
    landingPageUrl: '',
    imageUrl: ''
  }],
  coverMap: {},
}

export default {
  name: "CampaignManagement",
  components: {
    CreativeCardPreview,
    TemplateConf,
    CsFilterQuery,
    CampaignTasks,
    CsDrawerContainer,
    CsRadioCheckbox,
    DragWeektime,
    draggable,
    beetlesSearch,
    CommonCpn,
    CreativePull,
    CampaignClone,
    AcoAdEdit,
    AdForm,
    AdGroupForm,
    DocsSingleSelectDrawer,
    BatchUpdateAdGroupTargeting,
    AdGroupClone,
    BatchAdConfirm,
    BatchAdGroupConfirm,
    BatchCampaignConfirm,
    AdClone,
    SuggestCover
  },
  data() {
    var validateCampaignBudget = (rule, value, callback) => {
      if (this.campaignForm.budgetOptimizeSwitch === 1 || this.campaignForm.budgetSwitch) {
        if (value === '') {
          callback(new Error('请输入预算'))
        } else if (parseInt(value) < 50 || parseInt(value) > 10000000) {
          callback(new Error('预算应为 50.00 - 10,000,000.00间的纯数字'))
        } else if (this.campaignForm.budgetMode === '') {
          callback(new Error('请选择预算模式'))
        } else {
          callback()
        }
      } else {
        callback()
      }
    }
    var validateEditCampaignBudget = (rule, value, callback) => {
      if (this.singleEditCampaignForm.budgetOptimizeSwitch === 1 || this.singleEditCampaignForm.budgetSwitch) {
        if (value === '') {
          callback(new Error('请输入预算,预算应为 50.00 - 10,000,000.00间的纯数字'))
        } else if (parseInt(value) < 50 || parseInt(value) > 10000000) {
          callback(new Error('预算应为 50.00 - 10,000,000.00间的纯数字'))
        } else if (this.singleEditCampaignForm.budgetMode === '') {
          callback(new Error('请选择预算模式'))
        } else {
          callback()
        }
      } else {
        callback()
      }
    }
    var validateAdGroupBudget = (rule, value, callback) => {
      if (value === '') {
        callback(new Error('请输入预算'))
      } else if (this.adGroupForm.budgetMode === '') {
        callback(new Error('请选择预算模式'))
      } else {
        if (this.adGroupForm.budgetMode === 'BUDGET_MODE_DAY') {
          if (parseInt(value) < 20) {
            callback(new Error('预算必须大于20'))
          } else {
            callback()
          }
        } else {
          // 计算算天数
          if (parseInt(value) < this.countBudgetForDay()) {
            callback(new Error('预算必须大于' + this.countBudgetForDay()))
          } else {
            callback()
          }
        }

      }
    }
    var validateAdGroupEndTime = (rule, value, callback) => {
      if (this.adGroupForm.scheduleType === 'SCHEDULE_FROM_NOW') {
        callback()
      } else {
        if (value === null) {
          callback(new Error('请选择结束日期'))
        } else if (new Date(this.adGroupForm.scheduleStartTime).getTime() > new Date(value).getTime()) {
          callback(new Error('结束日期必须大于开始时间'))
        } else {
          callback()
        }
      }
    }
    var validateOptimizationEvent = (rule, value, callback) => {
      if (this.adGroupForm.optimizationGoal === 'IN_APP_EVENT' || this.adGroupForm.optimizationGoal === 'INSTALL_IN_APP_EVENT') {
        if (value) {
          callback()
        } else {
          callback(new Error('请选择优化投放数据'))
        }
      } else {
        callback()
      }
    }
    var validateRoasBid = (rule, value, callback) => {
      if (this.adGroupForm.isSetROAS) {
        if (value === '') {
          callback(new Error('请输入ROAS下限值'))
        } else {
          callback()
        }
      } else {
        callback()
      }
    }
    var validateBidPrice = (rule, value, callback) => {
      if (this.adGroupForm.bidType === 'BID_TYPE_CUSTOM' && this.adGroupForm.optimizationGoal === 'CLICK') {
        if (value === '') {
          callback(new Error('请输入出价'))
        } else if (parseFloat(value) <= 0) {
          callback(new Error('出价必须大于0'))
        } else if (parseFloat(value) >= parseFloat(this.adGroupForm.budget)) {
          callback(new Error('出价必须小于预算'))
        } else {
          callback()
        }
      } else {
        callback()
      }
    }
    var validateConversionBidPrice = (rule, value, callback) => {
      if (this.adGroupForm.bidType === 'BID_TYPE_CUSTOM' && this.adGroupForm.optimizationGoal !== 'CLICK') {
        if (value === '') {
          callback(new Error('(Conversion)请输入出价'))
        } else if (parseFloat(value) <= 0) {
          callback(new Error('(Conversion)出价必须大于0'))
        } else if (parseFloat(value) >= parseFloat(this.adGroupForm.budget)) {
          callback(new Error('(Conversion)出价必须小于预算' + value + ':' + this.adGroupForm.budget))
        } else {
          callback()
        }
      } else {
        callback()
      }
    }
    var validateCallToAction = (rule, value, callback) => {
      if (this.adGroupForm.creativeMaterialMode === 'CUSTOM') {
        if (this.adForm.callToActionType == '0' && this.adForm.callToAction === '') {
          callback(new Error('选择CTA'))
        } else {
          callback()
        }
      } else {
        callback()
      }
    }
    var validateCallToActionArr = (rule, value, callback) => {
      if (this.adGroupForm.creativeMaterialMode === 'DYNAMIC') {
        if (this.adForm.callToActionType == '0' && this.adForm.callToActionArr.length === 0) {
          callback(new Error('选择CTA'))
        } else {
          callback()
        }
      } else {
        callback()
      }
    }
    var validateVideoRelated = (rule, value, callback) => {
      if (this.adGroupForm.videoRelatedCategoryIds.length > 0) {
        if (value.length === 0) {
          callback(new Error("添加行为:视频互动每一项必须输入"))
        } else {
          callback()
        }
      } else {
        callback()
      }
    }
    var validateVideoRelatedCategoryIds = (rule, value, callback) => {
      if (this.adGroupForm.videoUserAction.VIDEO_RELATED.length > 0) {
        if (value.length === 0) {
          callback(new Error("添加行为:视频互动每一项必须输入"))
        } else {
          callback()
        }
      } else {
        callback()
      }
    }
    var validateActionPeriod = (rule, value, callback) => {
      if (this.adGroupForm.videoUserAction.VIDEO_RELATED.length > 0 || this.adGroupForm.videoRelatedCategoryIds.length > 0) {
        if (value === '') {
          callback(new Error("添加行为:视频互动每一项必须输入"))
        } else {
          callback()
        }
      } else {
        callback()
      }
    }
    var validateCreatorRelated = (rule, value, callback) => {
      if (this.adGroupForm.creatorRelatedCategoryIds.length > 0) {
        if (value.length === 0) {
          callback(new Error("添加行为:创作者互动每一项必须输入"))
        } else {
          callback()
        }
      } else {
        callback()
      }
    }
    var validateCreatorRelatedCategoryIds = (rule, value, callback) => {
      if (this.adGroupForm.videoUserAction.CREATOR_RELATED.length > 0) {
        if (value.length === 0) {
          callback(new Error("添加行为:创作者互动每一项必须输入"))
        } else {
          callback()
        }
      } else {
        callback()
      }
    }
    var validatePlacement = (rule, value, callback) => {
      if (this.adGroupForm.placementType === 'PLACEMENT_TYPE_NORMAL') {
        if (value.length === 0) {
          callback(new Error("请选择至少一个版位"))
        } else {
          callback()
        }
      } else {
        callback()
      }
    }
    var validateGrouplist = (rule, value, callback) => {
      if (this.adGroupForm.autoCreateType === 1) {
        if (value.length > 0) {
          const rs = value.every(item => {
            return item.locationIds.length > 0
          })
          if (rs) {
            callback()
          } else {
            callback(new Error("请选择国家"))
          }
        } else {
          callback(new Error("请选择国家"))
        }
      } else {
        callback()
      }
    }
    var validateLocationIdsArr = (rule, value, callback) => {
      if (this.adGroupForm.autoCreateType === 2) {
        if (value.every(item => item.length > 0)) {
          return callback()
        } else {
          callback(new Error("请选择国家"))
        }
      } else {
        callback()
      }
    }
    var validateAdAppo = (rule, value, callback) => {
      if (this.singleEditAdForm.campaignAppProfilePageState === 'ON') {
        if (value === '') {
          callback(new Error("请选择至少一个落地页"))
        }
        {
          callback()
        }
      } else {
        callback()
      }
    }
    return {
      editAcoCoverMap: new Map(),
      suggestCoverOp: '',
      suggestCoverAccount: '',
      suggestCreative: {},
      openSuggestCover: false,
      batchUpdateNameBtnLoading: false,
      excludeAdStatus: [0, 1, 2, 3, 6],
      excludeAdGroupStatus: [0, 1, 2, 3, 6],
      excludeCampaignStatus: [0, 1, 2, 3, 6],
      tiktokAccountUrl: "https://ads.tiktok.com/i18n/perf/campaign?aadvid=",
      batchCampaignStatus: "",
      batchAdStatus: "",
      batchAdGroupStatus: "",
      batchCampaignTitle: "",
      batchAdTitle: "",
      batchAdGroupTitle: "",
      batchUpdateAdGroupStatusShow: false,
      batchUpdateAdStatusShow: false,
      batchUpdateCampaignStatusShow: false,
      containACO: false,
      batchDialogAdName: [],
      batchDialogCampName: [],
      batchDialogAdGroupName: [],
      creatorsList: [],
      adGroupTargets: [],
      showAdGroupTargeting: false,
      curEditAdgroup: 0,
      visibleDocs: false,
      isACO: false,
      previewCreative: null,
      assetPreview: false,
      errCampTableShow: false,
      errCampTable: [],
      errAdGroupTableShow: false,
      errAdGroupTable: [],
      errAdTableShow: false,
      errAdTable: [],
      batchUpdateBidTips: false,
      batchUpdateNegTips: false,
      batchUpdateCampBudTips: false,
      batchUpdateCampNegTips: false,
      batchUpdateAdGroupBudTips: false,
      batchUpdateAdGroupNegTips: false,
      singleEditADGexpansionDisabled: false,
      singleEditVideoRelated: [],
      singleEditCreatorRelated: [],
      singleEditCampLoading: false,
      singleEditAdGroupLoading: false,
      singleEditAdLoading: false,
      tempEditAudienceIds: [],
      tempEditAudienceList: [],
      tempEditAudienceArr: [],
      tempEditAudienceExcludeIds: [],
      tempEditAudienceExcludeList: [],
      tempEditAudienceExcludeArr: [],
      changeTypeMethodDisable: true,
      campaignBudget: false,
      campaignNameEdit: {
        editEnable: false,
        editIndex: '',
        newVal: '',
      },
      singleEditAdGroupFormLoading: false,
      singleEditAdGroupButtonLoading: false,
      totalCampaignCost: {},
      totalAdgroupCost: {},
      batchUpdateAdgroupBudgetForm: {
        changeType: 0,
        amount: 0,
        changeMethod: 0,
      },
      bcUpdateBudgetChangeMethod: [
        {value: 0, label: "把预算修改至"},
        {value: 1, label: "把预算增加"},
        {value: 2, label: "把预算减少"},
      ],
      bcUpdateBidChangeMethod: [
        {value: 0, label: "把出价修改至"},
        {value: 1, label: "把出价增加"},
        {value: 2, label: "把出价减少"},
      ],
      bcUpdateBudgetChangeTypes: [
        {value: 0, label: "$"},
        {value: 1, label: "%"},
      ],
      campUpdateBudgetTotalList: [],
      campUpdateBudgetDayList: [],
      campUpdateBudgetList: [],
      showBatchUpdateCampBudget: false,
      showBatchUpdateCampBudgetLoading: false,
      campUpdateNames: [],
      showBatchUpdateCampNames: false,
      showBatchUpdateCampNamesLoading: false,
      adGroupUpdateNames: [],
      showBatchUpdateAdGroupName: false,
      showBatchUpdateAdGroupNameLoading: false,
      adGroupUpdateBidList: [],
      showBatchUpdateBid: false,
      showBatchUpdateBidLoading: false,
      disableEditAdGroupInterests: false,
      adGroupBudgetAllTypeList: [],
      adGroupBudgetDayList: [],
      adGroupBudgetTotalList: [],
      adGroupBudgetDisableList: [],
      adGroupactiveIndex: 'ad-group-budget-day',
      showBatchUpdateBudget: false,
      showBatchUpdateBudgetLoading: false,
      editIdentityListLoading: true,
      initAdCreativeId: '',
      editAdIdentityId: '',
      editAdCallToActionType: '',
      EditAdCreatives: {},
      singleEditAdForm: {
        //ID
        id: null,
        // 广告名字
        adName: '',
        // Spark Ads
        sparkAdsSwitch: false,
        // 批量
        batch: false,
        // 批量实现类型
        autoCreateType: 1,
        // 素材格式
        adFormat: 'SINGLE_VIDEO',
        // 动态优选
        callToActionType: '1',
        // 展示动态监测
        impressionTrackingUrl: '',
        // 点击监测url
        clickTrackingUrl: '',
        // 素材列表
        creativeList: [],
        // 单文案
        word: '',
        // 多文案
        words: [''],
        // 行动引导文案
        callToAction: 'DOWNLOAD_NOW',
        platformId: '',
        acoCreatives: [],
        acoAdTexts: [],
        acoCTAs: [],
        adIds: [],
        oldCTAType: '',
        oldAcoCreatives: [],
        oldAcoAdTexts: [],
        oldAcoCTAs: [],
        oldCoverMap: new Map(),
        pageId: 0,
        landingPageUrl: '',
      },
      singleEditAdFormTemplate: {
        id: null,
        // 广告名字
        adName: '',
        // Spark Ads
        sparkAdsSwitch: false,
        // 批量
        batch: false,
        // 批量实现类型
        autoCreateType: 1,
        // 素材格式
        adFormat: 'SINGLE_VIDEO',
        // 动态优选
        callToActionType: '1',
        // 展示动态监测
        impressionTrackingUrl: '',
        // 点击监测url
        clickTrackingUrl: '',
        // 素材列表
        creativeList: [],
        // 单文案
        word: '',
        // 多文案
        words: [''],
        // 行动引导文案
        callToAction: 'DOWNLOAD_NOW',
        platformId: '',
        acoCreatives: [],
        acoAdTexts: [],
        acoCTAs: [],
        adIds: [],
        oldCTAType: '',
        oldAcoCreatives: [],
        oldAcoAdTexts: [],
        oldAcoCTAs: [],
        oldCoverMap: new Map(),
        pageId: 0,
        landingPageUrl: '',
      },
      showEditAds: false,
      tableColumnDrawer: false,
      headerQueryIntputLeft: '',
      checkedBaseTarget: [],
      isIndeterminate: true,
      isIndeterminate1: false,
      isIndeterminate2: false,
      isIndeterminate3: true,
      checkAll: false,
      checkAll1: false,
      checkAll2: false,
      checkAll3: false,
      checkAppEvent: [],
      checkAttributionEvent: [],
      checkSetting: [],
      checkedBaseTarget1: [],
      headerQueryIntputRight: '',
      tableHeaderOpt: [],
      tableColumnData: [],
      defaultTableColumnData: [
        {sortable: 'custom', label: "总消耗", value: "appEvent.spend", checked: true},
        {sortable: 'custom', label: "CPC", value: "appEvent.cpc", checked: true},
        {sortable: 'custom', label: "CPM", value: "appEvent.cpm", checked: true},
        {sortable: 'custom', label: "展示数", value: "appEvent.impressions", checked: true},
        {sortable: 'custom', label: "点击数", value: "appEvent.clicks", checked: true},
        {sortable: 'custom', label: "CTR", value: "appEvent.ctr", checked: true},
        {sortable: 'custom', label: "总覆盖人数", value: "appEvent.reach"},
        {sortable: 'custom', label: "覆盖千人成本", value: "appEvent.cost_per_1000_reached"},
        {sortable: 'custom', label: "频次", value: "appEvent.frequency"},
        {sortable: 'custom', label: "转化数", value: "appEvent.conversion", checked: true},
        {sortable: 'custom', label: "转化成本", value: "appEvent.cost_per_conversion", checked: true},
        {sortable: 'custom', label: "转化率", value: "appEvent.conversion_rate", checked: true},
        {sortable: 'custom', label: "实时转化", value: "appEvent.real_time_conversion"},
        {sortable: 'custom', label: "实时单次转化费用", value: "appEvent.real_time_cost_per_conversion"},
        {sortable: 'custom', label: "实时转化率", value: "appEvent.real_time_conversion_rate"},
        {sortable: 'custom', label: "成效", value: "appEvent.result", checked: true},
        {sortable: 'custom', label: "单次成效费用", value: "appEvent.cost_per_result", checked: true},
        {sortable: 'custom', label: "成效率", value: "appEvent.result_rate", checked: true},
        {sortable: 'custom', label: "实时成效", value: "appEvent.real_time_result"},
        {sortable: 'custom', label: "实时单次成效费用", value: "appEvent.real_time_cost_per_result"},
        {sortable: 'custom', label: "实时成效率", value: "appEvent.real_time_result_rate"},
        {sortable: 'custom', label: "成效（SKAN）", value: "appEvent.skan_result"},
        {sortable: 'custom', label: "单次成效费用（SKAN）", value: "appEvent.skan_cost_per_result"},
        {sortable: 'custom', label: "成效率（SKAN）", value: "appEvent.skan_result_rate"},
        {sortable: 'custom', label: "转化数（SKAN）", value: "appEvent.skan_conversion"},
        {sortable: 'custom', label: "转化成本（SKAN）", value: "appEvent.skan_cost_per_conversion"},
        {sortable: 'custom', label: "转化率（SKAN）", value: "appEvent.skan_conversion_rate"},
      ],
      // 归因数据
      defaultAttributionEventColumn: [
        {sortable: 'custom', label: "点击归因付费次数", value: "appEvent.cta_purchase"},
        {sortable: 'custom', label: "点击归因付费成本", value: "appEvent.cost_per_cta_purchase"},
        {sortable: 'custom', label: "展示归因转化数", value: "appEvent.vta_conversion"},
        {sortable: 'custom', label: "展示归因转化成本", value: "appEvent.cost_per_vta_conversion"},
      ],
      defaultSettingColumn: [
        {sortable: false, value: "campaignName", label: "推广系列名称", checked: false},
        {sortable: false, value: "ttCampaignId", label: "推广系列ID", checked: false},
        {sortable: false, value: "ttAdgroupId", label: "广告组ID"},
        {sortable: false, value: "accountName", label: "账户名", checked: true, overflow: true},
        {sortable: false, value: "platformId", label: "账户ID", checked: true, overflow: true},
        {sortable: false, value: "timezone", label: "时区", checked: true},
        {sortable: false, label: "诊断意见", value: "onlineStatus",},
        {sortable: false, value: "createTime", label: "创建日期", width: 100,},
        {sortable: false, label: '推广目标', value: 'objectiveType'},
        {sortable: false, value: "plataaform123", label: "排期（广告组层级）", width: 100},
        {sortable: 'custom', value: "plataaform12", label: "出价（广告组层级）", width: 100},
        {sortable: false, value: "plataaform1", label: "深层目标出价（广告组层级）", width: 100},
        {sortable: false, value: "optimizationEvent", label: "应用类事件优化类型", width: 100},
        // {sortable: false, label: "优化类型", value: "adTypes"},
        // {sortable: false, label: "广告组设置", value: "adGroupSetting"},
        // {sortable: false, label: "推广系列类型", value: "campaignType"},
        // {sortable: false, label: "来源", value: "origin"}
      ],
      defaultAppEventColumn: [
        {sortable: 'custom', label: "安装—实时应用安装", value: "appEvent.real_time_app_install"},
        {sortable: 'custom', label: "安装—实时单次安装成本", value: "appEvent.real_time_app_install_cost"},
        {sortable: 'custom', label: "安装—应用安装", value: "appEvent.app_install"},
        {sortable: 'custom', label: "安装—应用安装成本", value: "appEvent.cost_per_app_install"},
        {sortable: 'custom', label: "安装 (SKAN)—应用安装数 (SKAN)", value: "appEvent.skan_app_install"},
        {sortable: 'custom', label: "安装 (SKAN)—应用安装成本 (SKAN)", value: "appEvent.skan_cost_per_app_install"},
        {sortable: 'custom', label: "注册—去重注册数", value: "appEvent.registration"},
        {sortable: 'custom', label: "注册—去重注册成本", value: "appEvent.cost_per_registration"},
        {sortable: 'custom', label: "注册—去重注册率(%）", value: "appEvent.registration_rate"},
        {sortable: 'custom', label: "注册—总注册数", value: "appEvent.total_registration"},
        {sortable: 'custom', label: "注册—单次注册成本", value: "appEvent.cost_per_total_registration"},
        {sortable: 'custom', label: "注册 (SKAN)—去重注册数 (SKAN)", value: "appEvent.skan_total_registration"},
        {sortable: 'custom', label: "注册 (SKAN)—去重注册成本 (SKAN)", value: "appEvent.skan_cost_per_total_registration"},
        {sortable: 'custom', label: "注册 (SKAN)—去重注册率(%） (SKAN)", value: "appEvent.skan_registration_rate"},
        {sortable: 'custom', label: "注册 (SKAN)—总注册数 (SKAN)", value: "appEvent.skan_registration"},
        {sortable: 'custom', label: "注册 (SKAN)—单次注册成本 (SKAN)", value: "appEvent.skan_cost_per_registration"},
        {sortable: 'custom', label: "付费—去重付费数", value: "appEvent.purchase"},
        {sortable: 'custom', label: "付费—去重付费成本", value: "appEvent.cost_per_purchase"},
        {sortable: 'custom', label: "付费—去重付费率(%）", value: "appEvent.purchase_rate"},
        {sortable: 'custom', label: "付费—单次付费成本", value: "appEvent.cost_per_total_purchase"},
        {sortable: 'custom', label: "付费—单次付费价值", value: "appEvent.value_per_total_purchase"},
        {sortable: 'custom', label: "付费—总付费价值", value: "appEvent.total_purchase_value"},
        {sortable: 'custom', label: "付费—广告花费回报-付费", value: "appEvent.total_active_pay_roas"},
        {sortable: 'custom', label: "付费 (SKAN)—去重付费数 (SKAN)", value: "appEvent.skan_purchase"},
        {sortable: 'custom', label: "付费 (SKAN)—去重付费成本 (SKAN)", value: "appEvent.skan_cost_per_purchase"},
        {sortable: 'custom', label: "付费 (SKAN)—去重付费率(%） (SKAN)", value: "appEvent.skan_purchase_rate"},
        {sortable: 'custom', label: "付费 (SKAN)—总付费数 (SKAN)", value: "appEvent.skan_total_purchase"},
        {sortable: 'custom', label: "付费 (SKAN)—单次付费成本 (SKAN)", value: "appEvent.skan_cost_per_total_purchase"},
        {sortable: 'custom', label: "付费 (SKAN)—总付费价值 (SKAN)", value: "appEvent.skan_total_purchase_value"},
        {sortable: 'custom', label: "加入购物车—去重加入购物车数", value: "appEvent.app_event_add_to_cart"},
        {sortable: 'custom', label: "加入购物车—去重加入购物车成本", value: "appEvent.cost_per_app_event_add_to_cart"},
        {sortable: 'custom', label: "加入购物车—去重加入购物车率(%）", value: "appEvent.app_event_add_to_cart_rate"},
        {sortable: 'custom', label: "加入购物车—总加入购物车数", value: "appEvent.total_app_event_add_to_cart"},
        {sortable: 'custom', label: "加入购物车—单次加入购物车成本", value: "appEvent.cost_per_total_app_event_add_to_cart"},
        {sortable: 'custom', label: "加入购物车—单次加入购物车价值", value: "appEvent.value_per_total_app_event_add_to_cart"},
        {sortable: 'custom', label: "加入购物车—总加入购物车价值", value: "appEvent.total_app_event_add_to_cart_value"},
        {sortable: 'custom', label: "加入购物车 (SKAN)—去重加入购物车数 (SKAN)", value: "appEvent.skan_add_to_cart"},
        {sortable: 'custom', label: "加入购物车 (SKAN)—去重加入购物车成本 (SKAN)", value: "appEvent.skan_cost_per_add_to_cart"},
        {sortable: 'custom', label: "加入购物车 (SKAN)—去重加入购物车率(%） (SKAN)", value: "appEvent.skan_add_to_cart_rate"},
        {sortable: 'custom', label: "加入购物车 (SKAN)—总加入购物车数 (SKAN)", value: "appEvent.skan_total_add_to_cart"},
        {sortable: 'custom', label: "加入购物车 (SKAN)—单次加入购物车成本 (SKAN)", value: "appEvent.skan_cost_per_total_add_to_cart"},
        {sortable: 'custom', label: "加入购物车 (SKAN)—总加入购物车价值 (SKAN)", value: "appEvent.skan_total_add_to_cart_value"},
        {sortable: 'custom', label: "下单—去重下单数", value: "appEvent.checkout"},
        {sortable: 'custom', label: "下单—去重下单成本", value: "appEvent.cost_per_checkout"},
        {sortable: 'custom', label: "下单—去重下单率(%）", value: "appEvent.checkout_rate"},
        {sortable: 'custom', label: "下单—总下单数", value: "appEvent.total_checkout"},
        {sortable: 'custom', label: "下单—单次下单成本", value: "appEvent.cost_per_total_checkout"},
        {sortable: 'custom', label: "下单—单次下单价值", value: "appEvent.value_per_checkout"},
        {sortable: 'custom', label: "下单—总下单价值", value: "appEvent.total_checkout_value"},
        {sortable: 'custom', label: "下单 (SKAN)—去重下单数 (SKAN)", value: "appEvent.skan_checkout"},
        {sortable: 'custom', label: "下单 (SKAN)—去重下单成本 (SKAN)", value: "appEvent.skan_cost_per_checkout"},
        {sortable: 'custom', label: "下单 (SKAN)—去重下单率(%） (SKAN)", value: "appEvent.skan_checkout_rate"},
        {sortable: 'custom', label: "下单 (SKAN)—总下单数 (SKAN)", value: "appEvent.skan_total_checkout"},
        {sortable: 'custom', label: "下单 (SKAN)—单次下单成本 (SKAN)", value: "appEvent.skan_cost_per_total_checkout"},
        {sortable: 'custom', label: "下单 (SKAN)—总下单价值 (SKAN)", value: "appEvent.skan_total_checkout_value"},
        {sortable: 'custom', label: "查看内容—去重查看内容数", value: "appEvent.view_content"},
        {sortable: 'custom', label: "查看内容—去重查看内容成本", value: "appEvent.cost_per_view_content"},
        {sortable: 'custom', label: "查看内容—去重查看内容率(%）", value: "appEvent.view_content_rate"},
        {sortable: 'custom', label: "查看内容—总查看内容数", value: "appEvent.total_view_content"},
        {sortable: 'custom', label: "查看内容—单次查看内容成本", value: "appEvent.cost_per_total_view_content"},
        {sortable: 'custom', label: "查看内容—单次查看内容价值", value: "appEvent.value_per_total_view_content"},
        {sortable: 'custom', label: "查看内容—总查看内容价值", value: "appEvent.total_view_content_value"},
        {sortable: 'custom', label: "查看详情 (SKAN)—去重查看详情数 (SKAN)", value: "appEvent.skan_view_content"},
        {sortable: 'custom', label: "查看详情 (SKAN)—去重查看详情成本 (SKAN)", value: "appEvent.skan_cost_per_view_content"},
        {sortable: 'custom', label: "查看详情 (SKAN)—去重查看详情率(%） (SKAN)", value: "appEvent.skan_view_content_rate"},
        {sortable: 'custom', label: "查看详情 (SKAN)—总查看详情数 (SKAN)", value: "appEvent.skan_total_view_content"},
        {sortable: 'custom', label: "查看详情 (SKAN)—单次查看详情成本 (SKAN)", value: "appEvent.skan_cost_per_total_view_content"},
        {sortable: 'custom', label: "查看详情 (SKAN)—总查看详情价值 (SKAN)", value: "appEvent.skan_total_view_content_value"},
        {sortable: 'custom', label: "留存—唯一次日留存", value: "appEvent.next_day_open"},
        {sortable: 'custom', label: "留存—唯一次日留存平均成本", value: "appEvent.cost_per_next_day_open"},
        {sortable: 'custom', label: "留存—唯一次日留存率(%）", value: "appEvent.next_day_open_rate"},
        {sortable: 'custom', label: "留存—次日总留存量", value: "appEvent.total_next_day_open"},
        {sortable: 'custom', label: "留存—次日留存平均成本", value: "appEvent.cost_per_total_next_day_open"},
        {sortable: 'custom', label: "添加支付信息数—去重添加支付信息数", value: "appEvent.add_payment_info"},
        {sortable: 'custom', label: "添加支付信息数—去重添加支付信息成本", value: "appEvent.cost_per_add_payment_info"},
        {sortable: 'custom', label: "添加支付信息数—去重添加支付信息率(%）", value: "appEvent.add_payment_info_rate"},
        {sortable: 'custom', label: "添加支付信息数—总添加支付信息数", value: "appEvent.total_add_payment_info"},
        {sortable: 'custom', label: "添加支付信息数—单次添加支付信息成本", value: "appEvent.cost_total_add_payment_info"},
        {sortable: 'custom', label: "添加支付信息数—总加入心愿单数", value: "appEvent.total_add_to_wishlist"},
        {sortable: 'custom', label: "添加付款信息 (SKAN)—去重添加付款信息数 (SKAN)", value: "appEvent.skan_add_payment_info"},
        {
          sortable: 'custom',
          label: "添加付款信息 (SKAN)—去重添加付款信息成本 (SKAN)",
          value: "appEvent.skan_cost_per_add_payment_info"
        },
        {sortable: 'custom', label: "添加付款信息 (SKAN)—去重添加付款信息率(%） (SKAN)", value: "appEvent.skan_add_payment_info_rate"},
        {sortable: 'custom', label: "添加付款信息 (SKAN)—总添加付款信息数 (SKAN)", value: "appEvent.skan_total_add_payment_info"},
        {
          sortable: 'custom',
          label: "添加付款信息 (SKAN)—单次添加付款信息成本 (SKAN)",
          value: "appEvent.skan_cost_total_add_payment_info"
        },
        {sortable: 'custom', label: "加入心愿单—去重加入心愿单数", value: "appEvent.add_to_wishlist"},
        {sortable: 'custom', label: "加入心愿单—去重加入心愿单成本", value: "appEvent.cost_per_add_to_wishlist"},
        {sortable: 'custom', label: "加入心愿单—去重加入心愿单率(%）", value: "appEvent.add_to_wishlist_rate"},
        {sortable: 'custom', label: "加入心愿单—单次加入心愿单成本", value: "appEvent.cost_per_total_add_to_wishlist"},
        {sortable: 'custom', label: "加入心愿单—单次加入心愿单价值", value: "appEvent.value_per_total_add_to_wishlist"},
        {sortable: 'custom', label: "加入心愿单—总加入心愿单价值", value: "appEvent.total_add_to_wishlist_value"},
        {sortable: 'custom', label: "加入心愿单 (SKAN)—去重加入心愿单数 (SKAN)", value: "appEvent.skan_add_to_wishlist"},
        {sortable: 'custom', label: "加入心愿单 (SKAN)—去重加入心愿单成本 (SKAN)", value: "appEvent.skan_cost_per_add_to_wishlist"},
        {sortable: 'custom', label: "加入心愿单 (SKAN)—去重加入心愿单率(%） (SKAN)", value: "appEvent.skan_add_to_wishlist_rate"},
        {sortable: 'custom', label: "加入心愿单 (SKAN)—总加入心愿单数 (SKAN)", value: "appEvent.skan_total_add_to_wishlist"},
        {
          sortable: 'custom',
          label: "加入心愿单 (SKAN)—单次加入心愿单成本 (SKAN)",
          value: "appEvent.skan_cost_per_total_add_to_wishlist"
        },
        {sortable: 'custom', label: "加入心愿单 (SKAN)—总加入心愿单价值 (SKAN)", value: "appEvent.skan_total_add_to_wishlist_value"},
        {sortable: 'custom', label: "应用打开数—去重应用打开数", value: "appEvent.launch_app"},
        {sortable: 'custom', label: "应用打开数—去重应用打开成本", value: "appEvent.cost_per_launch_app"},
        {sortable: 'custom', label: "应用打开数—去重应用打开率(%）", value: "appEvent.launch_app_rate"},
        {sortable: 'custom', label: "应用打开数—总应用打开数", value: "appEvent.total_launch_app"},
        {sortable: 'custom', label: "应用打开数—单次应用打开成本", value: "appEvent.cost_per_total_launch_app"},
        {sortable: 'custom', label: "应用打开数 (SKAN)—去重打开应用数 (SKAN)", value: "appEvent.skan_launch_app"},
        {sortable: 'custom', label: "应用打开数 (SKAN)—去重打开应用成本 (SKAN)", value: "appEvent.skan_cost_per_launch_app"},
        {sortable: 'custom', label: "应用打开数 (SKAN)—去重打开应用率(%） (SKAN)", value: "appEvent.skan_launch_app_rate"},
        {sortable: 'custom', label: "应用打开数 (SKAN)—总打开应用数 (SKAN)", value: "appEvent.skan_total_launch_app"},
        {sortable: 'custom', label: "应用打开数 (SKAN)—单次打开应用成本 (SKAN)", value: "appEvent.skan_cost_per_total_launch_app"},
        {sortable: 'custom', label: "完成新手教程—去重完成新手教程数", value: "appEvent.complete_tutorial"},
        {sortable: 'custom', label: "完成新手教程—去重完成新手教程成本", value: "appEvent.cost_per_complete_tutorial"},
        {sortable: 'custom', label: "完成新手教程—去重完成新手教程率(%）", value: "appEvent.complete_tutorial_rate"},
        {sortable: 'custom', label: "完成新手教程—总完成新手教程数", value: "appEvent.total_complete_tutorial"},
        {sortable: 'custom', label: "完成新手教程—单次完成新手教程成本", value: "appEvent.cost_per_total_complete_tutorial"},
        {sortable: 'custom', label: "完成新手教程—单次完成新手教程价值", value: "appEvent.value_per_total_complete_tutorial"},
        {sortable: 'custom', label: "完成新手教程—总完成新手教程价值", value: "appEvent.total_complete_tutorial_value"},
        {sortable: 'custom', label: "完成新手教程 (SKAN)—去重完成新手教程数 (SKAN)", value: "appEvent.skan_complete_tutorial"},
        {
          sortable: 'custom',
          label: "完成新手教程 (SKAN)—去重完成新手教程成本 (SKAN)",
          value: "appEvent.skan_cost_per_complete_tutorial"
        },
        {sortable: 'custom', label: "完成新手教程 (SKAN)—去重完成新手教程率(%） (SKAN)", value: "appEvent.skan_complete_tutorial_rate"},
        {sortable: 'custom', label: "完成新手教程 (SKAN)—总完成新手教程数 (SKAN)", value: "appEvent.skan_total_complete_tutorial"},
        {
          sortable: 'custom',
          label: "完成新手教程 (SKAN)—单次完成新手教程成本 (SKAN)",
          value: "appEvent.skan_cost_per_total_complete_tutorial"
        },
        {
          sortable: 'custom',
          label: "完成新手教程 (SKAN)—总完成新手教程价值 (SKAN)",
          value: "appEvent.skan_total_complete_tutorial_value"
        },
        {sortable: 'custom', label: "创建战队—去重创建战队数", value: "appEvent.create_group"},
        {sortable: 'custom', label: "创建战队—去重创建战队成本", value: "appEvent.cost_per_create_group"},
        {sortable: 'custom', label: "创建战队—去重创建战队率(%）", value: "appEvent.create_group_rate"},
        {sortable: 'custom', label: "创建战队—去重加入战队数", value: "appEvent.join_group"},
        {sortable: 'custom', label: "创建战队—去重加入战队成本", value: "appEvent.cost_per_join_group"},
        {sortable: 'custom', label: "创建战队—去重加入战队率(%）", value: "appEvent.join_group_rate"},
        {sortable: 'custom', label: "创建战队—总创建战队数", value: "appEvent.total_create_group"},
        {sortable: 'custom', label: "创建战队—单次创建战队成本", value: "appEvent.cost_per_total_create_group"},
        {sortable: 'custom', label: "创建战队—单次创建战队价值", value: "appEvent.value_per_total_create_group"},
        {sortable: 'custom', label: "创建战队—总创建战队价值", value: "appEvent.total_create_group_value"},
        {sortable: 'custom', label: "创建战队—总加入战队数", value: "appEvent.total_join_group"},
        {sortable: 'custom', label: "创建战队—单次加入战队成本", value: "appEvent.cost_per_total_join_group"},
        {sortable: 'custom', label: "创建战队—单次加入战队价值", value: "appEvent.value_per_total_join_group"},
        {sortable: 'custom', label: "创建战队—总加入战队价值", value: "appEvent.total_join_group_value"},
        {sortable: 'custom', label: "创建战队 (SKAN)—去重创建战队数 (SKAN)", value: "appEvent.skan_create_group"},
        {sortable: 'custom', label: "创建战队 (SKAN)—去重创建战队成本 (SKAN)", value: "appEvent.skan_cost_per_create_group"},
        {sortable: 'custom', label: "创建战队 (SKAN)—去重创建战队率(%） (SKAN)", value: "appEvent.skan_create_group_rate"},
        {sortable: 'custom', label: "创建战队 (SKAN)—总创建战队数 (SKAN)", value: "appEvent.skan_total_create_group"},
        {sortable: 'custom', label: "创建战队 (SKAN)—单次创建战队成本 (SKAN)", value: "appEvent.skan_cost_per_total_create_group"},
        {sortable: 'custom', label: "创建战队 (SKAN)—总创建战队价值 (SKAN)", value: "appEvent.skan_total_create_group_value"},
        {sortable: 'custom', label: "创建战队 (SKAN)—去重加入战队数 (SKAN)", value: "appEvent.skan_join_group"},
        {sortable: 'custom', label: "创建战队 (SKAN)—去重加入战队成本 (SKAN)", value: "appEvent.skan_cost_per_join_group"},
        {sortable: 'custom', label: "创建战队 (SKAN)—去重加入战队率(%） (SKAN)", value: "appEvent.skan_join_group_rate"},
        {sortable: 'custom', label: "创建战队 (SKAN)—总加入战队数 (SKAN)", value: "appEvent.skan_total_join_group"},
        {sortable: 'custom', label: "创建战队 (SKAN)—单次加入战队成本 (SKAN)", value: "appEvent.skan_cost_per_total_join_group"},
        {sortable: 'custom', label: "创建战队 (SKAN)—总加入战队价值 (SKAN)", value: "appEvent.skan_total_join_group_value"},
        {sortable: 'custom', label: "创建角色—去重创建角色数", value: "appEvent.create_gamerole"},
        {sortable: 'custom', label: "创建角色—去重创建角色成本", value: "appEvent.cost_per_create_gamerole"},
        {sortable: 'custom', label: "创建角色—去重创建角色率(%）", value: "appEvent.create_gamerole_rate"},
        {sortable: 'custom', label: "创建角色—总创建角色数", value: "appEvent.total_create_gamerole"},
        {sortable: 'custom', label: "创建角色—单次创建角色成本", value: "appEvent.cost_per_total_create_gamerole"},
        {sortable: 'custom', label: "创建角色—单次创建角色价值", value: "appEvent.value_per_total_create_gamerole"},
        {sortable: 'custom', label: "创建角色—总创建角色价值", value: "appEvent.total_create_gamerole_value"},
        {sortable: 'custom', label: "创建角色 (SKAN)—去重创建角色数 (SKAN)", value: "appEvent.skan_create_gamerole"},
        {sortable: 'custom', label: "创建角色 (SKAN)—去重创建角色成本 (SKAN)", value: "appEvent.skan_cost_per_create_gamerole"},
        {sortable: 'custom', label: "创建角色 (SKAN)—去重创建角色率(%） (SKAN)", value: "appEvent.skan_create_gamerole_rate"},
        {sortable: 'custom', label: "创建角色 (SKAN)—总创建角色数 (SKAN)", value: "appEvent.skan_total_create_gamerole"},
        {
          sortable: 'custom',
          label: "创建角色 (SKAN)—单次创建角色成本 (SKAN)",
          value: "appEvent.skan_cost_per_total_create_gamerole"
        },
        {sortable: 'custom', label: "创建角色 (SKAN)—总创建角色价值 (SKAN)", value: "appEvent.skan_total_create_gamerole_value"},
        {sortable: 'custom', label: "花费点数—去重花费点数数", value: "appEvent.spend_credits"},
        {sortable: 'custom', label: "花费点数—去重花费点数成本", value: "appEvent.cost_per_spend_credits"},
        {sortable: 'custom', label: "花费点数—去重花费点数率(%）", value: "appEvent.spend_credits_rate"},
        {sortable: 'custom', label: "花费点数—总花费点数数", value: "appEvent.total_spend_credits"},
        {sortable: 'custom', label: "花费点数—单次花费点数成本", value: "appEvent.cost_per_total_spend_credits"},
        {sortable: 'custom', label: "花费点数—单次花费点数价值", value: "appEvent.value_per_total_spend_credits"},
        {sortable: 'custom', label: "达到等级—去重达到等级数", value: "appEvent.achieve_level"},
        {sortable: 'custom', label: "达到等级—去重达到等级成本", value: "appEvent.cost_per_achieve_level"},
        {sortable: 'custom', label: "达到等级—去重达到等级率(%）", value: "appEvent.achieve_level_rate"},
        {sortable: 'custom', label: "达到等级—总花费点数价值", value: "appEvent.total_spend_credits_value"},
        {sortable: 'custom', label: "达到等级—总达到等级数", value: "appEvent.total_achieve_level"},
        {sortable: 'custom', label: "达到等级—单次达到等级成本", value: "appEvent.cost_per_total_achieve_level"},
        {sortable: 'custom', label: "达到等级—单次达到等级价值", value: "appEvent.value_per_total_achieve_level"},
        {sortable: 'custom', label: "达到等级—总达到等级价值", value: "appEvent.total_achieve_level_value"},
        {sortable: 'custom', label: "达到等级 (SKAN)—去重花费点数数 (SKAN)", value: "appEvent.skan_spend_credits"},
        {sortable: 'custom', label: "达到等级 (SKAN)—去重花费点数成本 (SKAN)", value: "appEvent.skan_cost_per_spend_credits"},
        {sortable: 'custom', label: "达到等级 (SKAN)—去重花费点数率(%） (SKAN)", value: "appEvent.skan_spend_credits_rate"},
        {sortable: 'custom', label: "达到等级 (SKAN)—总花费点数数 (SKAN)", value: "appEvent.skan_total_spend_credits"},
        {sortable: 'custom', label: "达到等级 (SKAN)—单次花费点数成本 (SKAN)", value: "appEvent.skan_cost_per_total_spend_credits"},
        {sortable: 'custom', label: "达到等级 (SKAN)—总花费点数价值 (SKAN)", value: "appEvent.skan_total_spend_credits_value"},
        {sortable: 'custom', label: "达到等级 (SKAN)—去重达到等级数 (SKAN)", value: "appEvent.skan_achieve_level"},
        {sortable: 'custom', label: "达到等级 (SKAN)—去重达到等级成本 (SKAN)", value: "appEvent.skan_cost_per_achieve_level"},
        {sortable: 'custom', label: "达到等级 (SKAN)—去重达到等级率(%） (SKAN)", value: "appEvent.skan_achieve_level_rate"},
        {sortable: 'custom', label: "达到等级 (SKAN)—总达到等级数 (SKAN)", value: "appEvent.skan_total_achieve_level"},
        {sortable: 'custom', label: "达到等级 (SKAN)—单次达到等级成本 (SKAN)", value: "appEvent.skan_cost_per_total_achieve_level"},
        {sortable: 'custom', label: "达到等级 (SKAN)—总达到等级价值 (SKAN)", value: "appEvent.skan_total_achieve_level_value"},
        {sortable: 'custom', label: "解锁关卡—去重解锁关卡数", value: "appEvent.unlock_achievement"},
        {sortable: 'custom', label: "解锁关卡—去重解锁关卡成本", value: "appEvent.cost_per_unlock_achievement"},
        {sortable: 'custom', label: "解锁关卡—去重解锁关卡率(%）", value: "appEvent.unlock_achievement_rate"},
        {sortable: 'custom', label: "解锁关卡—总解锁关卡数", value: "appEvent.total_unlock_achievement"},
        {sortable: 'custom', label: "解锁关卡—单次解锁关卡成本", value: "appEvent.cost_per_total_unlock_achievement"},
        {sortable: 'custom', label: "解锁关卡—单次解锁关卡价值", value: "appEvent.value_per_total_unlock_achievement"},
        {sortable: 'custom', label: "解锁关卡—总解锁关卡价值", value: "appEvent.total_unlock_achievement_value"},
        {sortable: 'custom', label: "解锁关卡 (SKAN)—去重解锁关卡数 (SKAN)", value: "appEvent.skan_unlock_achievement"},
        {sortable: 'custom', label: "解锁关卡 (SKAN)—去重解锁关卡成本 (SKAN)", value: "appEvent.skan_cost_per_unlock_achievement"},
        {sortable: 'custom', label: "解锁关卡 (SKAN)—去重解锁关卡率(%） (SKAN)", value: "appEvent.skan_unlock_achievement_rate"},
        {sortable: 'custom', label: "解锁关卡 (SKAN)—总解锁关卡数 (SKAN)", value: "appEvent.skan_total_unlock_achievement"},
        {
          sortable: 'custom',
          label: "解锁关卡 (SKAN)—单次解锁关卡成本 (SKAN)",
          value: "appEvent.skan_cost_per_total_unlock_achievement"
        },
        {
          sortable: 'custom',
          label: "解锁关卡 (SKAN)—总解锁关卡价值 (SKAN)",
          value: "appEvent.skan_total_unlock_achievement_value"
        },
        {sortable: 'custom', label: "销售线索—去重销售线索数", value: "appEvent.sales_lead"},
        {sortable: 'custom', label: "销售线索—去重销售线索成本", value: "appEvent.cost_per_sales_lead"},
        {sortable: 'custom', label: "销售线索—去重销售线索率(%）", value: "appEvent.sales_lead_rate"},
        {sortable: 'custom', label: "销售线索—总销售线索数", value: "appEvent.total_sales_lead"},
        {sortable: 'custom', label: "销售线索—单次销售线索成本", value: "appEvent.cost_per_total_sales_lead"},
        {sortable: 'custom', label: "销售线索—单次销售线索价值", value: "appEvent.value_per_total_sales_lead"},
        {sortable: 'custom', label: "销售线索—总销售线索价值", value: "appEvent.total_sales_lead_value"},
        {sortable: 'custom', label: "销售线索 (SKAN)—去重获得销售线索数 (SKAN)", value: "appEvent.skan_sales_lead"},
        {sortable: 'custom', label: "销售线索 (SKAN)—去重获得销售线索成本 (SKAN)", value: "appEvent.skan_cost_per_sales_lead"},
        {sortable: 'custom', label: "销售线索 (SKAN)—去重获得销售线索率(%） (SKAN)", value: "appEvent.skan_sales_lead_rate"},
        {sortable: 'custom', label: "销售线索 (SKAN)—总获得销售线索数 (SKAN)", value: "appEvent.skan_total_sales_lead"},
        {sortable: 'custom', label: "销售线索 (SKAN)—单次获得销售线索成本 (SKAN)", value: "appEvent.skan_cost_per_total_sales_lead"},
        {sortable: 'custom', label: "销售线索 (SKAN)—总获得销售线索价值 (SKAN)", value: "appEvent.skan_total_sales_lead_value"},
        {sortable: 'custom', label: "应用内广告点击—去重应用内广告点击数", value: "appEvent.in_app_ad_click"},
        {sortable: 'custom', label: "应用内广告点击—去重应用内广告点击成本", value: "appEvent.cost_per_in_app_ad_click"},
        {sortable: 'custom', label: "应用内广告点击—去重应用内广告点击率(%）", value: "appEvent.in_app_ad_click_rate"},
        {sortable: 'custom', label: "应用内广告点击—总应用内广告点击数", value: "appEvent.total_in_app_ad_click"},
        {sortable: 'custom', label: "应用内广告点击—单次应用内广告点击成本", value: "appEvent.cost_per_total_in_app_ad_click"},
        {sortable: 'custom', label: "应用内广告点击—单次应用内广告点击价值", value: "appEvent.value_per_total_in_app_ad_click"},
        {sortable: 'custom', label: "应用内广告点击—总应用内广告点击价值", value: "appEvent.total_in_app_ad_click_value"},
        {sortable: 'custom', label: "应用内广告点击 (SKAN)—去重应用内广告点击数 (SKAN)", value: "appEvent.skan_in_app_ad_click"},
        {
          sortable: 'custom',
          label: "应用内广告点击 (SKAN)—去重应用内广告点击成本 (SKAN)",
          value: "appEvent.skan_cost_per_in_app_ad_click"
        },
        {sortable: 'custom', label: "应用内广告点击 (SKAN)—去重应用内广告点击率(%） (SKAN)", value: "appEvent.skan_in_app_ad_click_rate"},
        {sortable: 'custom', label: "应用内广告点击 (SKAN)—总应用内广告点击数 (SKAN)", value: "appEvent.skan_total_in_app_ad_click"},
        {
          sortable: 'custom',
          label: "应用内广告点击 (SKAN)—单次应用内广告点击成本 (SKAN)",
          value: "appEvent.skan_cost_per_total_in_app_ad_click"
        },
        {
          sortable: 'custom',
          label: "应用内广告点击 (SKAN)—总应用内广告点击价值 (SKAN)",
          value: "appEvent.skan_total_in_app_ad_click_value"
        },
        {sortable: 'custom', label: "应用内广告展示—去重应用内广告展示数", value: "appEvent.in_app_ad_impr"},
        {sortable: 'custom', label: "应用内广告展示—去重应用内广告展示成本", value: "appEvent.cost_per_in_app_ad_impr"},
        {sortable: 'custom', label: "应用内广告展示—去重应用内广告展示率(%）", value: "appEvent.in_app_ad_impr_rate"},
        {sortable: 'custom', label: "应用内广告展示—总应用内广告展示数", value: "appEvent.total_in_app_ad_impr"},
        {sortable: 'custom', label: "应用内广告展示—单次应用内广告展示成本", value: "appEvent.cost_per_total_in_app_ad_impr"},
        {sortable: 'custom', label: "应用内广告展示—单次应用内广告展示价值", value: "appEvent.value_per_total_in_app_ad_impr"},
        {sortable: 'custom', label: "应用内广告展示—总应用内广告展示价值", value: "appEvent.total_in_app_ad_impr_value"},
        {sortable: 'custom', label: "应用内广告展示 (SKAN)—去重应用内广告展示数 (SKAN)", value: "appEvent.skan_in_app_ad_impr"},
        {
          sortable: 'custom',
          label: "应用内广告展示 (SKAN)—去重应用内广告展示成本 (SKAN)",
          value: "appEvent.skan_cost_per_in_app_ad_impr"
        },
        {sortable: 'custom', label: "应用内广告展示 (SKAN)—去重应用内广告展示率(%） (SKAN)", value: "appEvent.skan_in_app_ad_impr_rate"},
        {sortable: 'custom', label: "应用内广告展示 (SKAN)—总应用内广告展示数 (SKAN)", value: "appEvent.skan_total_in_app_ad_impr"},
        {
          sortable: 'custom',
          label: "应用内广告展示 (SKAN)—单次应用内广告展示成本 (SKAN)",
          value: "appEvent.skan_cost_per_total_in_app_ad_impr"
        },
        {
          sortable: 'custom',
          label: "应用内广告展示 (SKAN)—总应用内广告展示价值 (SKAN)",
          value: "appEvent.skan_total_in_app_ad_impr_value"
        },
        {sortable: 'custom', label: "贷款申请—去重贷款申请数", value: "appEvent.loan_apply"},
        {sortable: 'custom', label: "贷款申请—去重贷款申请成本", value: "appEvent.cost_per_loan_apply"},
        {sortable: 'custom', label: "贷款申请—去重贷款申请率(%）", value: "appEvent.loan_apply_rate"},
        {sortable: 'custom', label: "贷款申请—总贷款申请数", value: "appEvent.total_loan_apply"},
        {sortable: 'custom', label: "贷款申请—单次贷款申请成本", value: "appEvent.cost_per_total_loan_apply"},
        {sortable: 'custom', label: "贷款申请 (SKAN)—去重申请贷款数 (SKAN)", value: "appEvent.skan_loan_apply"},
        {sortable: 'custom', label: "贷款申请 (SKAN)—去重申请贷款成本 (SKAN)", value: "appEvent.skan_cost_per_loan_apply"},
        {sortable: 'custom', label: "贷款申请 (SKAN)—去重申请贷款率(%） (SKAN)", value: "appEvent.skan_loan_apply_rate"},
        {sortable: 'custom', label: "贷款申请 (SKAN)—总申请贷款数 (SKAN)", value: "appEvent.skan_total_loan_apply"},
        {sortable: 'custom', label: "贷款申请 (SKAN)—单次申请贷款成本 (SKAN)", value: "appEvent.skan_cost_per_total_loan_apply"},
        {sortable: 'custom', label: "授信—去重授信数", value: "appEvent.loan_credit"},
        {sortable: 'custom', label: "授信—去重授信成本", value: "appEvent.cost_per_loan_credit"},
        {sortable: 'custom', label: "授信—去重授信率(%）", value: "appEvent.loan_credit_rate"},
        {sortable: 'custom', label: "授信—总授信数", value: "appEvent.total_loan_credit"},
        {sortable: 'custom', label: "授信—单次授信成本", value: "appEvent.cost_per_total_loan_credit"},
        {sortable: 'custom', label: "授信 (SKAN)—去重授信数 (SKAN)", value: "appEvent.skan_loan_credit"},
        {sortable: 'custom', label: "授信 (SKAN)—去重授信成本 (SKAN)", value: "appEvent.skan_cost_per_loan_credit"},
        {sortable: 'custom', label: "授信 (SKAN)—去重授信率(%） (SKAN)", value: "appEvent.skan_loan_credit_rate"},
        {sortable: 'custom', label: "授信 (SKAN)—总授信数 (SKAN)", value: "appEvent.skan_total_loan_credit"},
        {sortable: 'custom', label: "授信 (SKAN)—单次授信成本 (SKAN)", value: "appEvent.skan_cost_per_total_loan_credit"},
        {sortable: 'custom', label: "放款—去重放款数", value: "appEvent.loan_disbursement"},
        {sortable: 'custom', label: "放款—去重放款成本", value: "appEvent.cost_per_loan_disbursement"},
        {sortable: 'custom', label: "放款—去重放款率(%）", value: "appEvent.loan_disbursement_rate"},
        {sortable: 'custom', label: "放款—总放款数", value: "appEvent.total_loan_disbursement"},
        {sortable: 'custom', label: "放款—单次放款成本", value: "appEvent.cost_per_total_loan_disbursement"},
        {sortable: 'custom', label: "放款 (SKAN)—去重放款数 (SKAN)", value: "appEvent.skan_loan_disbursement"},
        {sortable: 'custom', label: "放款 (SKAN)—去重放款成本 (SKAN)", value: "appEvent.skan_cost_per_loan_disbursement"},
        {sortable: 'custom', label: "放款 (SKAN)—去重放款率(%） (SKAN)", value: "appEvent.skan_loan_disbursement_rate"},
        {sortable: 'custom', label: "放款 (SKAN)—总放款数 (SKAN)", value: "appEvent.skan_total_loan_disbursement"},
        {sortable: 'custom', label: "放款 (SKAN)—单次放款成本 (SKAN)", value: "appEvent.skan_cost_per_total_loan_disbursement"},
        {sortable: 'custom', label: "登陆—去重登陆数", value: "appEvent.login"},
        {sortable: 'custom', label: "登陆—去重登陆成本", value: "appEvent.cost_per_login"},
        {sortable: 'custom', label: "登陆—去重登陆率(%）", value: "appEvent.login_rate"},
        {sortable: 'custom', label: "登陆—总登陆数", value: "appEvent.total_login"},
        {sortable: 'custom', label: "登陆—单次登陆成本", value: "appEvent.cost_per_total_login"},
        {sortable: 'custom', label: "登陆 (SKAN)—去重登录数 (SKAN)", value: "appEvent.skan_login"},
        {sortable: 'custom', label: "登陆 (SKAN)—去重登录成本 (SKAN)", value: "appEvent.skan_cost_per_login"},
        {sortable: 'custom', label: "登陆 (SKAN)—去重登录率(%） (SKAN)", value: "appEvent.skan_login_rate"},
        {sortable: 'custom', label: "登陆 (SKAN)—总登录数 (SKAN)", value: "appEvent.skan_total_login"},
        {sortable: 'custom', label: "登陆 (SKAN)—单次登录成本 (SKAN)", value: "appEvent.skan_cost_per_total_login"},
        {sortable: 'custom', label: "评价—去重评价数", value: "appEvent.ratings"},
        {sortable: 'custom', label: "评价—去重评价成本", value: "appEvent.cost_per_ratings"},
        {sortable: 'custom', label: "评价—去重评价率(%）", value: "appEvent.ratings_rate"},
        {sortable: 'custom', label: "评价—总评价数", value: "appEvent.total_ratings"},
        {sortable: 'custom', label: "评价—单次评价成本", value: "appEvent.cost_per_total_ratings"},
        {sortable: 'custom', label: "评价—单次评价价值", value: "appEvent.value_per_total_ratings"},
        {sortable: 'custom', label: "评价—总评价价值", value: "appEvent.total_ratings_value"},
        {sortable: 'custom', label: "评价 (SKAN)—去重评价数 (SKAN)", value: "appEvent.skan_ratings"},
        {sortable: 'custom', label: "评价 (SKAN)—去重评价成本 (SKAN)", value: "appEvent.skan_cost_per_ratings"},
        {sortable: 'custom', label: "评价 (SKAN)—去重评价率(%） (SKAN)", value: "appEvent.skan_ratings_rate"},
        {sortable: 'custom', label: "评价 (SKAN)—总评价数 (SKAN)", value: "appEvent.skan_total_ratings"},
        {sortable: 'custom', label: "评价 (SKAN)—单次评价成本 (SKAN)", value: "appEvent.skan_cost_per_total_ratings"},
        {sortable: 'custom', label: "评价 (SKAN)—总评价价值 (SKAN)", value: "appEvent.skan_total_ratings_value"},
        {sortable: 'custom', label: "搜索—去重搜索", value: "appEvent.search"},
        {sortable: 'custom', label: "搜索—去重搜索成本", value: "appEvent.cost_per_search"},
        {sortable: 'custom', label: "搜索—去重搜索率(%）", value: "appEvent.search_rate"},
        {sortable: 'custom', label: "搜索—总搜索数", value: "appEvent.total_search"},
        {sortable: 'custom', label: "搜索—单次搜索成本", value: "appEvent.cost_per_total_search"},
        {sortable: 'custom', label: "搜索 (SKAN)—去重搜索数 (SKAN)", value: "appEvent.skan_search"},
        {sortable: 'custom', label: "搜索 (SKAN)—去重搜索成本 (SKAN)", value: "appEvent.skan_cost_per_search"},
        {sortable: 'custom', label: "搜索 (SKAN)—去重搜索率(%） (SKAN)", value: "appEvent.skan_search_rate"},
        {sortable: 'custom', label: "搜索 (SKAN)—总搜索数 (SKAN)", value: "appEvent.skan_total_search"},
        {sortable: 'custom', label: "搜索 (SKAN)—单次搜索成本 (SKAN)", value: "appEvent.skan_cost_per_total_search"},
        {sortable: 'custom', label: "开始试用—去重开始试用数", value: "appEvent.start_trial"},
        {sortable: 'custom', label: "开始试用—去重开始试用成本", value: "appEvent.cost_per_start_trial"},
        {sortable: 'custom', label: "开始试用—去重开始试用率(%）", value: "appEvent.start_trial_rate"},
        {sortable: 'custom', label: "开始试用—总开始试用数", value: "appEvent.total_start_trial"},
        {sortable: 'custom', label: "开始试用—单次开始试用成本", value: "appEvent.cost_per_total_start_trial"},
        {sortable: 'custom', label: "开始试用 (SKAN)—去重开始试用数 (SKAN)", value: "appEvent.skan_start_trial"},
        {sortable: 'custom', label: "开始试用 (SKAN)—去重开始试用成本 (SKAN)", value: "appEvent.skan_cost_per_start_trial"},
        {sortable: 'custom', label: "开始试用 (SKAN)—去重开始试用率(%） (SKAN)", value: "appEvent.skan_start_trial_rate"},
        {sortable: 'custom', label: "开始试用 (SKAN)—总开始试用数 (SKAN)", value: "appEvent.skan_total_start_trial"},
        {sortable: 'custom', label: "开始试用 (SKAN)—单次开始试用成本 (SKAN)", value: "appEvent.skan_cost_per_total_start_trial"},
        {sortable: 'custom', label: "订阅—去重订阅数", value: "appEvent.subscribe"},
        {sortable: 'custom', label: "订阅—去重订阅成本", value: "appEvent.cost_per_subscribe"},
        {sortable: 'custom', label: "订阅—去重订阅率(%）", value: "appEvent.subscribe_rate"},
        {sortable: 'custom', label: "订阅—总订阅数", value: "appEvent.total_subscribe"},
        {sortable: 'custom', label: "订阅—单次订阅成本", value: "appEvent.cost_per_total_subscribe"},
        {sortable: 'custom', label: "订阅—单次订阅价值", value: "appEvent.value_per_total_subscribe"},
        {sortable: 'custom', label: "订阅—总订阅价值", value: "appEvent.total_subscribe_value"},
        {sortable: 'custom', label: "订阅 (SKAN)—去重订阅数 (SKAN)", value: "appEvent.skan_subscribe"},
        {sortable: 'custom', label: "订阅 (SKAN)—去重订阅成本 (SKAN)", value: "appEvent.skan_cost_per_subscribe"},
        {sortable: 'custom', label: "订阅 (SKAN)—去重订阅率(%） (SKAN)", value: "appEvent.skan_subscribe_rate"},
        {sortable: 'custom', label: "订阅 (SKAN)—总订阅数 (SKAN)", value: "appEvent.skan_total_subscribe"},
        {sortable: 'custom', label: "订阅 (SKAN)—单次订阅成本 (SKAN)", value: "appEvent.skan_cost_per_total_subscribe"},
        {sortable: 'custom', label: "订阅 (SKAN)—总订阅价值 (SKAN)", value: "appEvent.skan_total_subscribe_value"},
      ],
      // 推广系列排除项
      excludeCampaignTableCol: ['campaignName', 'ttAdgroupId'],
      // 广告组排除项
      excludeAdGroupTableCol: ['ttAdgroupId', 'campaignName', 'adGroupName'],
      // 广告排除项
      excludeAdTableCol: [],
      showEditSingleAdGroup: false,
      singleEditAdGroupLocations: [],
      singleEditAdGroupLanguages: [],
      singleEditAdGroupAges: [],
      singleEditAdGroupInterestCategoryIds: [],
      singleEditAdGroupVideoRelatedCategoryIds: [],
      singleEditAdGroupCreatorRelatedCategoryIds: [],
      singleEditAdGroupAudienceIds: [],
      singleEditAdGroupExcludedAudienceIds: [],
      singleEditAdGroupPlacements: [],
      campaignTasksDialog: false,
      adGroupExist: false,
      enableSwitchBudgetModeSgCamp: false,
      enableSwitchBudgetSingleCampaign: false,
      selectedCampaigns: [],
      selectedAdGroups: [],
      selectedAds: [],
      singleEditCampaignForm: {
        // id
        id: null,
        // 账户
        platformId: '',
        // 推广系列类型
        campaignType: 'REGULAR_CAMPAIGN',
        // 推广目标
        objectiveType: 'APP_INSTALL',
        // ios14开关
        ios14Camppaign: false,
        campaignAppProfilePageState: 'OFF',
        // ios14必填
        appId: '',
        // 推广系列名称
        campaignName: 'Ads4each',
        // 创建拆分对比测试(temp)
        comparison: false,
        // 推广系列预算优化
        budgetOptimizeSwitch: 0,
        // 设置广告广系列预算
        budgetSwitch: false,
        // 预算模式
        budgetMode: '',
        // 预算
        budget: '',
        // app名称
        appName: ''
      },
      singleEditCampaignFormTemplate: {
        // id
        id: null,
        // 账户
        platformId: '',
        // 推广系列类型
        campaignType: 'REGULAR_CAMPAIGN',
        // 推广目标
        objectiveType: 'APP_INSTALL',
        // ios14开关
        ios14Camppaign: false,
        // ios14必填
        appId: '',
        // 推广系列名称
        campaignName: 'Ads4each',
        // 创建拆分对比测试(temp)
        comparison: false,
        // 推广系列预算优化
        budgetOptimizeSwitch: 0,
        // 设置广告广系列预算
        budgetSwitch: false,
        // 预算模式
        budgetMode: '',
        // 预算
        budget: '',
        // app名称
        appName: ''
      },
      showEditCampaign: false,
      currentAccountId: '',
      appLoading: false,
      accountList: [],
      appList: [],
      // 预算模式枚举
      budgetModeList: [{
        label: '日预算',
        value: 'BUDGET_MODE_DAY'
      }, {
        label: '总预算',
        value: 'BUDGET_MODE_TOTAL'
      },
        // {
        //   label: '不限预算',
        //   value: 'BUDGET_MODE_INFINITE'
        // }
      ],
      // 性别
      genderList: [
        {
          label: '不限',
          value: 'GENDER_UNLIMITED'
        }, {
          label: '男性',
          value: 'GENDER_MALE'
        }, {
          label: '女性',
          value: 'GENDER_FEMALE'
        }
      ],
      // 年龄
      ageGroupsList: [
        {
          label: '13-17岁',
          value: 'AGE_13_17'
        }, {
          label: '18-24岁',
          value: 'AGE_18_24'
        }, {
          label: '25-34岁',
          value: 'AGE_25_34'
        }, {
          label: '35-44岁',
          value: 'AGE_35_44'
        }, {
          label: '45-54岁',
          value: 'AGE_45_54'
        }, {
          label: '55+',
          value: 'AGE_55_100'
        },],
      //全年龄
      allAgeGroupsList: [
        {
          label: '不限',
          value: 'All_Age'
        },
        {
          label: '13-17岁',
          value: 'AGE_13_17'
        }, {
          label: '18-24岁',
          value: 'AGE_18_24'
        }, {
          label: '25-34岁',
          value: 'AGE_25_34'
        }, {
          label: '35-44岁',
          value: 'AGE_35_44'
        }, {
          label: '45-54岁',
          value: 'AGE_45_54'
        }, {
          label: '55+',
          value: 'AGE_55_100'
        },],
      // 受众语言
      languagesList: [],
      // 受众地区
      locationList: [],
      checkOptions: {
        isIndeterminate: false,
        checkAll: false,
      },

      checked: null,
      pageSelectAll: false,
      locationList2: [],
      // 家庭收入
      householdIncomeList: [
        {value: "TOP5", label: "家庭收入群体的前5%"},
        {value: "TOP10", label: "家庭收入群体的前10%"},
        {value: "TOP10_25", label: "家庭收入群体的前10-25%"},
        {value: "TOP25_50", label: "家庭收入群体的前25-50%"}],
      // 优化目标 IOS不支持VALUE
      iosOptimizationGoalList: [
        {value: "CLICK", label: "点击"},
        {value: "INSTALL", label: "安装"},
        {value: "IN_APP_EVENT", label: "应用内事件"},
        {value: "INSTALL_IN_APP_EVENT", label: "安装与应用内事件数据"}
      ],
      optimizationGoalList: [
        {value: "CLICK", label: "点击"},
        {value: "INSTALL", label: "安装"},
        {value: "VALUE", label: "价值"},
        {value: "IN_APP_EVENT", label: "应用内事件"},
        {value: "INSTALL_IN_APP_EVENT", label: "安装与应用内事件数据"}
      ],
      curOptimizationGoalList: [],
      // 行动引导文案
      callToActionList: [],
      // 版位
      placementsList: [
        // {value: "PLACEMENT_TOPBUZZ", label: "资讯应用系列"},
        {value: "PLACEMENT_TIKTOK", label: "TikTok"},
        {value: "PLACEMENT_PANGLE", label: "Pangle"},
      ],
      identityList: [],
      // 应用内事件
      optimizationEventList: [
        {
          label: "激活",
          value: "ACTIVE",
          disabled: true
        },
        {
          label: "注册",
          value: "ACTIVE_REGISTER",
          disabled: true
        },
        {
          label: "购买",
          value: "ACTIVE_PAY",
          disabled: true
        },
        {
          label: "创建角色",
          value: "CREATE_GAMEROLE",
          disabled: true
        },
        {
          label: "登录",
          value: "LOGIN",
          disabled: true
        },
        {
          label: "完成新手教程",
          value: "COMPLETE_TUTORIAL",
          disabled: true
        },
        {
          label: "次日留存",
          value: "NEXT_DAY_OPEN",
          disabled: true
        },
        {
          label: "App内添加购物车",
          value: "IN_APP_CART",
          disabled: true
        },
        {
          label: "加入心愿单",
          value: "ADD_TO_WISHLIST",
          disabled: true
        },
        {
          label: "打开App",
          value: "LAUNCH_APP",
          disabled: true
        },
        {
          label: "查看内容",
          value: "IN_APP_DETAIL_UV",
          disabled: true
        },
        {
          label: "创建战队",
          value: "CREATE_GROUP",
          disabled: true
        },
        {
          label: "获得销售线索",
          value: "SALES_LEAD",
          disabled: true
        },
        {
          label: "应用内广告点击",
          value: "IN_APP_AD_CLICK",
          disabled: true
        },
        {
          label: "应用内广告展示",
          value: "IN_APP_AD_IMPR",
          disabled: true
        },
        {
          label: "加入战队",
          value: "JOIN_GROUP",
          disabled: true
        },
        {
          label: "达到级别",
          value: "UPDATE_LEVEL",
          disabled: true
        },
        {
          label: "放款",
          value: "LOAN_COMPLETION",
          disabled: true
        },
        {
          label: "评价",
          value: "RATE",
          disabled: true
        },
        {
          label: "搜索",
          value: "SEARCH",
          disabled: true
        },
        {
          label: "花费点数",
          value: "SPEND_CREDITS",
          disabled: true
        },
        {
          label: "解锁关卡",
          value: "UNLOCK_ACHIEVEMENT",
          disabled: true
        },
        //二级事件
        {
          label: "添加付款信息",
          value: "ADD_PAYMENT_INFO",
          disabled: true
        },
        {
          label: "App内下单",
          value: "IN_APP_ORDER",
          disabled: true
        },
        {
          label: "申请贷款",
          value: "LOAN_APPLY",
          disabled: true
        },
        {
          label: "授信",
          value: "LOAN_CREDIT",
          disabled: true
        },
        {
          label: "开始试用",
          value: "START_TRIAL",
          disabled: true
        },
        {
          label: "订阅",
          value: "SUBSCRIBE",
          disabled: true
        },
        {
          label: "购买操作的ROI",
          value: "PURCHASE_ROI",
          disabled: true
        },
      ],
      // 兴趣列表
      tiktokInterestTree: [],
      tiktokInterestList: [],
      // 添加行为:视频互动
      creatorRelatedTree: [],
      creatorRelatedList: [],
      // 添加行为:创作者互动
      videoRelatedTree: [],
      videoRelatedList: [],
      // 受众列表
      audiencesList: [],
      excludedAudiencesList: [],
      // 搜索时间
      queryDate: null,
      // 筛选组件对象
      filterQueryInfo: {},
      // 页面状态 1:首页  2:推广系列  3:预览
      pageType: 1,
      campaignForm: _.cloneDeep(campaignForm),
      activeColor: "#13ce66",
      inactiveColor: "#ccc",
      // 步骤
      campaignStep: '',
      adGroupForm: _.cloneDeep(adGroupForm),
      // 高级选项
      AdvancedOpt: false,
      adForm: _.cloneDeep(adForm),
      finallyTableData: [],
      // 渲染广告组
      renderAdGroupList: [],
      // 从仓库上传抽屉
      uploadFromStroeDrawer: false,
      //编辑广告弹窗
      editFromStroeDrawer: false,
      // 素材搜索对象
      sizeType: [
        {label: "横幅", value: 'H'},
        {label: "竖幅", value: 'V'},
        {label: "方幅", value: 'S'},
      ],
      approvalStatusList: [
        {label: "等待提交", value: 0},
        {label: "等待审核", value: 1},
        {label: "审核通过", value: 2},
        {label: "审核拒绝", value: 3},
        {label: "禁用", value: 4},
      ],
      designersList: [],
      creativeQueryForm: {
        stringShortId: '',
        localFilename: '',
        name: '',
        type: '',
        used: null,
        date: '',
        beginDate: null,
        endDate: null,
        sizeType: '',
        requestName: '',
        strStatus: [1, 2],
        designer: '',
        auditTime: '',
      },
      // 素材页码
      creativePage: {
        current: 1,
        size: 10
      },
      creativeTotal: 0,
      // 素材数据
      creativeTableData: [],
      creativeLoading: false,
      // 多选
      multipleCreativeSelection: [],
      // 渲染广告组
      renderAdList: [[]],
      // 多选预览表
      finallyTableMultipleSelection: [],
      // campaign表单的校验
      campaignFormRules: {
        platformId: [{required: true, message: '请选择一个账户', trigger: 'change'}],
        appId: [{required: true, message: '请选择一个APP', trigger: 'change'}],
        campaignName: [{required: true, message: '请输入推广系列名称', trigger: 'blur'}],
        budget: [{validator: validateCampaignBudget, trigger: 'blur'}]
      },
      //edit campaign表单的验证
      singleEditCampaignFormRules: {
        campaignName: [{required: true, message: '请输入推广系列名称', trigger: 'blur'}],
        budget: [{trigger: 'blur', validator: validateEditCampaignBudget}]
      },
      // adGroup表单校验
      adGroupFormRules: {
        adgroupName: [{required: true, message: '请输入广告组名称', trigger: 'blur'}],
        budget: [{validator: validateAdGroupBudget, trigger: 'blur'}],
        scheduleStartTime: [{required: true, message: '请选择开始时间', trigger: 'change'}],
        scheduleEndTime: [{validator: validateAdGroupEndTime, trigger: 'change'}],
        optimizationEvent: [{validator: validateOptimizationEvent, trigger: 'change'}],
        roasBid: [{validator: validateRoasBid, trigger: 'blur'}],
        bidPrice: [{validator: validateBidPrice, trigger: 'blur'}],
        conversionBidPrice: [{validator: validateConversionBidPrice, trigger: 'blur'}],
        'videoUserAction.VIDEO_RELATED': [{validator: validateVideoRelated, trigger: 'change'}],
        videoRelatedCategoryIds: [{validator: validateVideoRelatedCategoryIds, trigger: 'change'}],
        actionPeriod: [{validator: validateActionPeriod, trigger: 'change'}],
        'videoUserAction.CREATOR_RELATED': [{validator: validateCreatorRelated, trigger: 'change'}],
        creatorRelatedCategoryIds: [{validator: validateCreatorRelatedCategoryIds, trigger: 'change'}],
        placement: [{validator: validatePlacement, trigger: 'change'}],
        groupList: [{validator: validateGrouplist}],
        locationIdsArr: [{validator: validateLocationIdsArr}]
      },
      //ad表单校验
      adFormRules: {
        adName: [{required: true, message: '请输入广告名称', trigger: 'blur'}],
        adIdentityId: [{required: true, message: '请选择发布者身份', trigger: 'change'}],
        callToAction: [{validator: validateCallToAction, trigger: 'change'}],
        callToActionArr: [{validator: validateCallToActionArr, trigger: 'change'}],
        pageId: [{required: true, message: '请选择应用介绍页', trigger: 'change'}]
      },
      //edit ad表单校验
      singleEditAdFormRules: {
        adName: [{required: true, message: '请输入广告名称', trigger: 'blur'}],
        adIdentityId: [{required: true, message: '请选择发布者身份', trigger: 'change'}],
        pageId: [{validator: validateAdAppo, trigger: 'change'}]
      },
      // Campaign表格数据
      campaignTableData: [],
      // campaign分页
      campaignPage: {
        size: 10,
        current: 1
      },
      campaignLoading: false,
      campaignTotal: 0,
      // 过滤字段
      queryFilterInfo: {},
      // 广告组表格数据
      adGroupTableData: [],
      adGroupLoading: false,
      adGroupTotal: 0,
      adGroupPage: {
        size: 10,
        current: 1
      },
      //
      adTableData: [],
      adLoading: false,
      adTotal: 0,
      adPage: {
        size: 10,
        current: 1
      },
      addIdentityDialog: false,
      identityForm: {
        value: ''
      },
      // 日期配置
      pickerOptions: {
        disabledDate(time) {
          return time.getTime() < Date.now() - 24 * 60 * 60 * 1000;
        }
      },
      audiencePickerOptions: {
        shortcuts: [{
          text: '今天',
          onClick(picker) {
            const start = Moment().startOf('day')._d;
            const end = Moment().startOf('day')._d;
            picker.$emit('pick', [start, end]);
          }
        },
          {
            text: '昨天',
            onClick(picker) {
              const start = Moment().subtract(1, "days")._d;
              const end = Moment().subtract(1, "days")._d;
              picker.$emit('pick', [start, end]);
            }
          }, {
            text: '过去7天',
            onClick(picker) {
              const end = Moment().subtract(1, "days")._d;
              const start = Moment().subtract(7, "days")._d;
              picker.$emit('pick', [start, end]);
            }
          }, {
            text: '过去14天',
            onClick(picker) {
              const end = Moment().subtract(1, "days")._d;
              const start = Moment().subtract(14, "days")._d;
              picker.$emit('pick', [start, end]);
            }
          }, {
            text: '过去30天',
            onClick(picker) {
              const end = Moment().subtract(1, "days")._d;
              const start = Moment().subtract(30, "days")._d;
              picker.$emit('pick', [start, end]);
            }
          }, {
            text: '本周',
            onClick(picker) {
              const start = Moment().startOf('week')._d;
              const end = Moment().startOf('week').add(1, "weeks")._d;
              picker.$emit('pick', [start, end]);
            }
          }, {
            text: '上周',
            onClick(picker) {
              const start = Moment().startOf('week').subtract(1, "weeks")._d;
              const end = Moment().startOf('week')._d
              picker.$emit('pick', [start, end]);
            }
          }, {
            text: '本月',
            onClick(picker) {
              const start = Moment().startOf('month')._d;
              const end = Moment().startOf('month').add(1, "months")._d;
              picker.$emit('pick', [start, end]);
            }
          }, {
            text: '上月',
            onClick(picker) {
              const start = Moment().startOf('month').subtract(1, 'months')._d;
              const end = Moment().startOf('month')._d;
              picker.$emit('pick', [start, end]);
            }
          }]
      },
      activeName: 'campaign',
      editCampaignDialog: false,
      editCampaigForm: {
        campaignId: '',
        campaignName: ''
      },
      editAdGroupDialog: false,
      editAdGroupForm: {
        adGroupId: '',
        groupName: ''
      },
      editAdDialog: false,
      editAdForm: {
        adId: '',
        adName: ''
      },
      // 当前任务id
      currentTaskId: null,
      // 推广系列表格受众选择
      campaignAudience: '',
      // 广告组表格受众选择
      adGroupAudience: '',
      // 广告表格受众选择
      adAudience: '',
      // 筛选受众数据
      filterAudienceList: [
        {label: "分天 ", value: "stat_time_day"},
        {label: "分年龄", value: "age"},
        {label: "分性别", value: "gender"},
        {label: "年龄+性别", value: "age,gender"},
        {label: "国家/地区", value: "country_code"},
        {label: "兴趣类别", value: "interest_category"},
        {label: "操作系统", value: "platform"},
        {label: "网络", value: "ac"},
      ],
      //tt 状态
      ttStatusList: {
        campaign: [],
        adGroup: [],
        ad: []
      },
      // 受众选择时间
      queryAudienceDate: [Moment().subtract(7, "days").format("yyyy-MM-DD"), Moment().format('yyyy-MM-DD')],
      // tiktok AD 层级受众信息数据
      AudiencesDataList: [],
      // 复制推广系列弹窗
      copyCampaignDialog: false,
      // 复制推广系列对象
      copyCampaignForm: {
        num: 1,
        platformId: '',
        isCreate: true,
        campaignName: ''
      },
      // 受众选择属性
      audiencesCascaderProp: {
        multiple: true,
        value: 'audienceId',
        label: 'name'
      },
      // 复制推广组弹窗
      copyAdGroupDialog: false,
      // 复制广告组对象
      copyAdGroupForm: {
        num: 1,
        isCreateCampaign: true,
        campaignName: '',
        campaignId: ''
      },
      copyAdGroupFormIsAdd: false,
      // 账户余额
      accountBalance: '0.0',
      // 操作类型 1、添加；2、推广系列复制；3、广告组复制；4、广告复制
      opeType: 1,
      // 所有campaign
      campaignList: [],
      copyAdDialog: false,
      // 复制广告对象
      copyAdForm: {
        num: 1,
        isCreateCampaign: true,
        campaignId: '',
        isCreateAdGroup: true,
        campaignName: '',
        adGroupId: '',
        adGroupName: ''
      },
      copyAdFormIsAdd: false,
      // 所有广告组
      adGroupList: [],
      // 配额状态
      levelQuota: {
        campaignQuota: {
          availableQuota: '',
          releasingQuota: '',
          usedQuota: ''
        },
        adgroupQuota: {
          availableQuota: '',
          totalQuota: '',
          usedQuota: ''
        }
      },
      // 从文案库选择文案
      creativeTextSelection: false,
      textPage: {
        pageSize: 8,
        current: 1,
        total: 0
      },
      textData: [],
      searchTextData: [],
      textSelectData: [],
      textSearchData: '',
      creativeTexts: [],
      currentCreativeIndex: 0,
      tempValue: '',
      checkboxNetworkState: ['不限'],
      networkStateList: [
        {
          label: '不限',
          value: '不限'
        }, {
          label: 'WIFI',
          value: 'WIFI'
        }, {
          label: '2G',
          value: '2G'
        }, {
          label: '3G',
          value: '3G'
        }, {
          label: '4G',
          value: '4G'
        }, {
          label: '5G',
          value: '5G'
        },
      ],
      // 账户选择框加载
      selectAccountLoading: false,
      // 查询事件包含推广系列ID
      queryCampaignIds: '',
      queryAdGroupIds: '',
      queryAdIds: '',
      addIdentityLoading: false,
      // 临时测试
      tempVal: [],
      balanceBtnLoading: false,
      audiencesBtnLoading: false,
      interestBtnLoading: false,
      interestByKeywordLoading: false,
      interestByKeywordTimer: null,
      editNameBtnLoading: false,
      identityBtnLoading: false,
      tableData: [{}],
      weektimeData: weektimeData,
      multTimeRange: [],
      audiencesRes: [],
      // 账户时区
      timezone: 0,
      queryInterestsLoading: false,
      // 其他兴趣
      otherInterestList: [],
      // 当前app头像
      logoUrl: '',
      // 切换tab时是否清空重新加载
      refreshByChangeTabs: true,
      // 模板弹窗
      templateDialog: false,
      templateForm: {
        name: '自定义模板-' + Moment().format('yyyyMMDDHHmmss')
      },
      isTemplateLoading: false,
      templateList: [],
      templateVal: '',
      optimizationEventLoading: false,
      // 优化目标是否包含价值
      isHasValue: false,
      batchUpdateCampBudgetLoading: false,
      batchUpdateCampBudgetDisabled: true,
      batchUpdateAdGroupBudgetLoading: false,
      batchUpdateAdGroupBudgetDisabled: true,
      batchUpdateAdGroupBidLoading: false,
      batchUpdateAdGroupBidDisabled: true,
      submitCampaignLoading: false,
      // 状态参数列表
      statueValueList: [
        {
          value: 1,
          label: '创建中',
        }, {
          value: 3,
          label: '创建失败',
        }, {
          value: 5,
          label: '已暂停',
        }, {
          value: 4,
          label: '投放中',
        }, {
          value: 6,
          label: '已删除',
        },
        {
          value: 7,
          label: '未投放',
        },
        {
          value: 8,
          label: '已关闭',
        },
        {
          value: 9,
          label: '已完成',
        },
      ],
      // 竞价策略参数
      bidTypeList: [{value: '1', label: '最低成本'}, {value: '2', label: '出价上限'}, {value: '3', label: '成本上限'}],
      // 投放速度参数
      pacingList: [{value: 'PACING_MODE_SMOOTH', label: '标准'}, {value: 'PACING_MODE_FAST', label: '加速'}],
      // 竞价模式参数
      billingEventList: [
        {
          value: 'CPC',
          label: 'CPC',
        }, {
          value: 'OCPM',
          label: 'oCPM',
        },
      ],
      // 广告组设置参数
      creativeMaterialModelist: [
        {
          value: '',
          label: '所有',
        },
        {
          value: 'DYNAMIC',
          label: 'ACO广告组',
        }, {
          value: 'CUSTOM',
          label: '非ACO广告组',
        }
      ],
      // 广告样式参数
      creativeTypeList: [
        {
          value: 1,
          label: '图片',
        }, {
          value: 2,
          label: '视频（16：9）',
        }, {
          value: 3,
          label: '视频（1：1）',
        }, {
          value: 4,
          label: '视频（9：16）',
        },
      ],
      //SPC选项
      SPCList: [
        {
          value: 0,
          label: '非SPC',
        },
        {
          value: 1,
          label: 'SPC',
        }
      ],
      //APPO选项
      APPOList: [
        {
          value: "OFF",
          label: 'OFF',
        },
        {
          value: "ON",
          label: 'ON',
        }
      ],
      //推广系列类型
      campaignTypeList: [
        {
          value: "APPO_OFF",
          label: 'APPO关闭',
        },
        {
          value: "APPO_ON",
          label: 'APPO开启',
        },
        {
          value: "SPC_0",
          label: '非SPC',
        },
        {
          value: "SPC_1",
          label: 'SPC',
        }
      ],
      // 搜索组件表单
      queryForm: {
        queryAudienceDate: [Moment().subtract(7, "days").format("yyyy-MM-DD"), Moment().format('yyyy-MM-DD')],
        campaignName: '',
        adgroupName: '',
        adName: '',
        statusList: [],
        locationIds: [],
        placement: [],
        age: [],
        gender: [],
        optimizationGoal: [],
        bidType: [],
        pacing: [],
        billingEvent: [],
        creativeMaterialMode: [],
        creativeType: [],
        platformId: [],
        campaignTypes: ["SPC_0"],
        creators: [],
        adTypes: []
      },
      // 点击表格名称所选择的campaignId
      curSelCpId: '',
      // 点击表格名称所选择的adgroupId
      curSelAgId: '',
      // 检测名字时用campaipnId
      curCampaipnId: '',
      // 局部加载
      partLoading: false,
      accountList2: [],
      nextStepLoading: false,
      androidImage: '',
      iosImage: '',
      disabledCreativeMaterialMode: false,
      // 显示创建失败
      statusVal: false,
      copyCampaignOpt: null,
      // 新复制
      editAdGroupDrawer: false,
      editAdDrawer: false,
      adGroupOptions: {},
      adOptions: {},
      disabledAppSelect: false,
      // 落地页列表
      landingPageList: [],
      copyBtnLoading: false,
      landingPageLoading: false,
      isSuccessAdGroup: false,
      isSuccessCampaign: false,
      disabledSelIn: ["SPC_0"],
      copyMultipleAdGroupDialog: false,
      // 相关配置
      copyMultipleAdGroupOptions: {},
      copyAdGroupList: [],
      // 排序
      sortMap: {},
      copyMultipleAdDialog: false,
      copyMultipleAdOptions: {},
      copyAdList: [],
      campaignTotalData: {},
      adGroupTotalData: {},
      adTotalData: {},
      // 优化类型
      optimizeTypeList: [
        {value: 'MAI', lable: 'MAI'},
        {value: 'AEO', lable: 'AEO'},
        {value: 'RO', lable: 'RO'},
        {value: 'VBO', lable: 'VBO'},
      ]
    }
  },
  computed: {
    ...mapState({
      offerId: state => state.user.offer,
    }),
    isPangleRO() {
      if (this.adGroupForm.placementType === 'PLACEMENT_TYPE_NORMAL'
        && this.adGroupForm.placement.length == 1
        && this.adGroupForm.placement.includes('PLACEMENT_PANGLE')
        && this.adGroupForm.optimizationEvent === 'NEXT_DAY_OPEN'
        && this.adGroupForm.bidType === 'BID_TYPE_CUSTOM')
        return true
      return false
    },
    filterQueryOptions() {
      switch (this.activeName) {
        case 'campaign':
          return [{
            value: 'campaignName',
            label: '推广系列名称',
          }, {
            value: 'statusList',
            label: '状态',
            children: [
              {
                value: 1,
                label: '创建中',
              }, {
                value: 3,
                label: '创建失败',
              }, {
                value: 5,
                label: '已暂停',
              }, {
                value: 4,
                label: '投放中',
              }, {
                value: 7,
                label: '未投放',
              },
              {
                value: 6,
                label: '已删除',
              },
            ]
          }, {
            value: 'locationIds',
            label: '地域',
            queryList: this.locationList
          }]
        case 'adGroup':
          return [{
            value: 'adgroupName',
            label: '广告组名称',
          }, {
            value: 'statusList',
            label: '状态',
            children: [
              {
                value: 1,
                label: '创建中',
              }, {
                value: 3,
                label: '创建失败',
              }, {
                value: 5,
                label: '已暂停',
              }, {
                value: 4,
                label: '投放中',
              }, {
                value: 6,
                label: '已删除',
              },
              {
                value: 7,
                label: '未投放',
              },
              {
                value: 8,
                label: '已关闭',
              },
              {
                value: 9,
                label: '已完成',
              },
            ]
          }, {
            value: 'placement',
            label: '版位',
            children: this.placementsList
          }, {
            value: 'age',
            label: '年龄',
            children: this.ageGroupsList
          }, {
            value: 'gender',
            label: '性别',
            children: this.genderList
          }, {
            value: 'optimizationGoal',
            label: '优化目标',
            children: this.curOptimizationGoalList
          }, {
            value: 'bidType',
            label: '竞价策略',
            children: [{value: '1', label: '最低成本'}, {value: '2', label: '出价上限'}, {value: '3', label: '成本上限'}]
          }, {
            value: 'pacing',
            label: '投放速度',
            children: [{value: 'PACING_MODE_SMOOTH', label: '标准'}, {value: 'PACING_MODE_FAST', label: '加速'}]
          }, {
            value: 'locationIds',
            label: '地域',
            queryList: this.locationList
          }, {
            value: 'billingEvent',
            label: '竞价模式',
            children: [
              {
                value: 'CPC',
                label: 'CPC',
              }, {
                value: 'OCPM',
                label: 'oCPM',
              },
            ]
          }, {
            value: 'creativeMaterialMode',
            label: '广告组设置',
            children: [
              {
                value: '',
                label: '所有',
              },
              {
                value: 'DYNAMIC',
                label: 'ACO广告组',
              }, {
                value: 'CUSTOM',
                label: '非ACO广告组',
              }
            ]
          }]
        case 'ad':
          return [{
            value: 'adName',
            label: '广告名称',
          }, {
            value: 'statusList',
            label: '状态',
            children: [
              {
                value: 1,
                label: '创建中',
              }, {
                value: 3,
                label: '创建失败',
              }, {
                value: 5,
                label: '已暂停',
              }, {
                value: 4,
                label: '投放中',
              },
              {
                value: 7,
                label: '未投放',
              },
              {
                value: 8,
                label: '已关闭',
              },
              {
                value: 9,
                label: '已完成',
              },
              {
                value: 6,
                label: '已删除',
              },
            ]
          }, {
            value: 'locationIds',
            label: '地域',
            queryList: this.locationList
          }, {
            value: 'creativeType',
            label: '素材样式',
            children: [
              {
                value: 1,
                label: '图片',
              }, {
                value: 2,
                label: '视频（16：9）',
              }, {
                value: 3,
                label: '视频（1：1）',
              }, {
                value: 4,
                label: '视频（9：16）',
              },
            ]
          }]
      }
    },
    // 废弃
    transformQueryDate() {
      return {
        startTime: this.queryDate ? this.queryDate[0] : null,
        endTime: this.queryDate ? this.queryDate[1] : null
      }
    },
    transformQueryAudienceDate() {
      return {
        startTime: this.queryForm.queryAudienceDate ? this.queryForm.queryAudienceDate[0] : null,
        endTime: this.queryForm.queryAudienceDate ? this.queryForm.queryAudienceDate[1] : null
      }
    },
    // 生成搜索条件
    transformQueryForm() {
      let campaignIds = ''
      let adGroupIds = ''
      if (this.curSelCpId !== '') {
        campaignIds = this.curSelCpId
        adGroupIds = ''
      } else {
        campaignIds = this.selectedCampaigns.map(item => item.id).join(',')
      }
      if (this.curSelAgId !== '') {
        adGroupIds = this.curSelAgId
        campaignIds = ''
      } else {
        adGroupIds = this.selectedAdGroups.map(item => item.id).join(',')
      }

      return {
        campaignIds,
        adGroupIds,
        campaignName: this.queryForm.campaignName,
        adgroupName: this.queryForm.adgroupName,
        adName: this.queryForm.adName,
        statusList: this.queryForm.statusList.join(','),
        locationIds: this.queryForm.locationIds.join(','),
        placement: this.queryForm.placement.join(','),
        age: this.queryForm.age.join(','),
        gender: this.queryForm.gender.join(','),
        optimizationGoal: this.queryForm.optimizationGoal.join(','),
        bidType: this.queryForm.bidType.join(','),
        pacing: this.queryForm.pacing.join(','),
        billingEvent: this.queryForm.billingEvent.join(','),
        creativeMaterialMode: this.queryForm.creativeMaterialMode.join(','),
        creativeType: this.queryForm.creativeType.join(','),
        startTime: this.queryForm.queryAudienceDate ? this.queryForm.queryAudienceDate[0] : null,
        endTime: this.queryForm.queryAudienceDate ? this.queryForm.queryAudienceDate[1] : null,
        platformId: this.queryForm.platformId.join(','),
        showFailRecord: this.statusVal,
        campaignTypes: this.queryForm.campaignTypes.join(','),
        creators: this.queryForm.creators.join(','),
        adTypes: this.queryForm.adTypes.join(',')
      }
    },
    // transformCreativeText() {
    //   return this.textData.map(item => {
    //     return {value: item.text}
    //   })
    // },
    formatterTimezone() {
      if (this.timezone === '') {
        return `+00:00`
      } else {
        if (this.timezone >= 10) {
          return `+${this.timezone}:00`
        } else if (this.timezone >= 0) {
          return `+0${this.timezone}:00`
        } else if (this.timezone > -10) {
          return `-0${Math.abs(this.timezone)}:00`
        } else {
          return `${this.timezone}:00`
        }
      }
    },
    checkOptimizationValue() {
      if (this.campaignForm.os === 1) {
        if (this.isHasValue) {
          if (this.adGroupForm.placementType === 'PLACEMENT_TYPE_AUTOMATIC') {
            return false
          } else {
            if (this.adGroupForm.placement.includes("PLACEMENT_TIKTOK")) {
              return false
            } else {
              return true
            }
          }
        } else {
          return true
        }
      } else {
        return true
      }
    },
    // 基础指标搜索
    baseSearchData() {
      if (this.headerQueryIntputLeft) {
        return this.defaultTableColumnData.filter(item => {
          const input = this.headerQueryIntputLeft.toLowerCase()
          const label = item.label.toLowerCase()
          return label.includes(input)
        })
      } else {
        return this.defaultTableColumnData
      }
    },
    // 归因数据搜索
    attributionSearchData() {
      if (this.headerQueryIntputLeft) {
        return this.defaultAttributionEventColumn.filter(item => {
          const input = this.headerQueryIntputLeft.toLowerCase()
          const label = item.label.toLowerCase()
          return label.includes(input)
        })
      } else {
        return this.defaultAttributionEventColumn
      }
    },
    // 设置
    settingSearchData() {
      if (this.headerQueryIntputLeft) {
        return this.defaultSettingColumn.filter(item => {
          const input = this.headerQueryIntputLeft.toLowerCase()
          const label = item.label.toLowerCase()
          return label.includes(input)
        })
      } else {
        return this.defaultSettingColumn
      }
    },
    // 应用事件
    appEventSearchData() {
      if (this.headerQueryIntputLeft) {
        return this.defaultAppEventColumn.filter(item => {
          const input = this.headerQueryIntputLeft.toLowerCase()
          const label = item.label.toLowerCase()
          return label.includes(input)
        })
      } else {
        return this.defaultAppEventColumn
      }
    },
    filterTextData() {
      return this.searchTextData.slice((this.textPage.current - 1) * this.textPage.pageSize,
        this.textPage.current * this.textPage.pageSize)
    }
  },
  directives: {
    focus: {
      inserted: function (el) {
        el.querySelector("input").focus()
      }
    },
    // sticky: {
    //   // 当被绑定的元素插入到 DOM 中时……
    //   inserted (el, binding) {
    //     // 获取表格
    //     const thead = el.children[1]
    //     const tbody = el.children[2]
    //     // 获取滚动元素
    //     const scrollParent = document.querySelector(binding.value.parent)
    //     scrollParent.addEventListener('scroll', function () {
    //       // 获取thead距离顶部的距离
    //       const theadTop = thead.getBoundingClientRect().top
    //       if (theadTop <= binding.value.top) {
    //         thead.style.position = 'fixed'
    //         thead.style.zIndex = '2021'
    //         thead.style.top = binding.value.top + 'px'
    //         thead.style.width = tbody.offsetWidth + 'px'
    //       }
    //       // 判断是否需要回归原来位置
    //       const originally = tbody.getBoundingClientRect().top
    //       if (originally > binding.value.top) {
    //         thead.style.position = 'relative'
    //         thead.style.zIndex = '0'
    //         thead.style.top = 0 + 'px'
    //         thead.style.width = tbody.offsetWidth + 'px'
    //       }
    //       // 判断底部距离是否超过表头
    //       const goBeyond = tbody.getBoundingClientRect().bottom
    //       if (goBeyond <= thead.offsetHeight) {
    //         thead.style.position = 'relative'
    //         thead.style.zIndex = '0'
    //         thead.style.top = 0 + 'px'
    //         thead.style.width = tbody.offsetWidth + 'px'
    //       }
    //     })
    //   }
    // }
  },
  watch: {
    campaignStep(val) {
      if (this.pageType == 2) {
        this.$nextTick(
          () => {
            this.$refs.menu.open(val)
          }
        )
      }
    },
    // 切换订单
    offerId(val) {
      this.emptyForm()
      this.clearCreateFromData()
      this.getCreatorList()
      this.getData()
      this.accountList = []
    },
    'adGroupForm.groupList': {
      handler: function (val) {
        if (this.autoCreateType === 1) {
          this.adGroupForm.expansionEnabled = false
          if (val.length > 1) {
            this.adGroupForm.expansionswitch = true
            this.adGroupForm.expansionTypes = []
          } else {
            this.adGroupForm.expansionswitch = false
          }
        }
      }
    },
    'adGroupForm.locationIdsArr': {
      handler: function (val) {
        if (this.autoCreateType === 2) {
          this.adGroupForm.expansionEnabled = false
          if (val.length > 1) {
            this.adGroupForm.expansionswitch = true
            this.adGroupForm.expansionTypes = []
          } else {
            this.adGroupForm.expansionswitch = false
          }
        }
      }
    },
    'adGroupForm.languagesArr': {
      handler: function (val) {
        if (this.autoCreateType === 2) {
          this.adGroupForm.expansionEnabled = false
          if (val.length > 1) {
            this.adGroupForm.expansionswitch = true
            this.adGroupForm.expansionTypes = []
          } else {
            this.adGroupForm.expansionswitch = false
          }
        }
      }
    },
    'adGroupForm.genderArr': {
      handler: function (val) {
        if (this.autoCreateType === 2) {
          this.adGroupForm.expansionEnabled = false
          if (val.length > 1) {
            this.adGroupForm.expansionswitch = true
            this.adGroupForm.expansionTypes = []
          } else {
            this.adGroupForm.expansionswitch = false
          }
        }
      }
    },
    'adGroupForm.ageArr': {
      handler: function (val) {
        if (this.autoCreateType === 2) {
          this.adGroupForm.expansionEnabled = false
          if (val.length > 1) {
            this.adGroupForm.expansionswitch = true
            this.adGroupForm.expansionTypes = []
          } else {
            this.adGroupForm.expansionswitch = false
          }
        }
      }
    },
    pageType(newVal) {
      if (newVal === 2 || newVal == 3) {
        NProgress.configure({parent: 'body'}) // 进度条报错处理
      }
    },
  },
  beforeDestroy() {
    NProgress.configure({parent: 'body'}) // 进度条报错处理
  },
  created() {
    this.getCreatorList()
    this.getCustomTtEventTemplate()
    this.changeDefualtTemplate()
    this.curOptimizationGoalList = deepClone(this.optimizationGoalList)
    this.getData()
    getTextList(this.offerId).then(res => {
      this.searchTextData = this.textData = res.data.data;
      this.textData.forEach(item => {
        this.creativeTexts.push(item.text)
      })
    });
    this.ttStatusList = getTtStatus();
    this.languagesList = getLanguagesList();
    this.callToActionList = getCallToActionList();
    this.locationList2 = getLocationList();
  },
  mounted() {
  },
  methods: {
    changeEditAcoCoverMap(coverMap) {
      this.editAcoCoverMap = coverMap
    },
    returnCoverId(coverId, creativeId, accountId, url) {
      if (this.suggestCoverOp === 'create') {
        this.adForm.coverMap[creativeId] = coverId
        let cv = this.adForm.adList[this.curEditAdgroup].creativeList.find(item => item.id === creativeId)
        if (cv !== undefined) {
          cv.thumbnailUrl = url
        }
      } else {
        this.singleEditAdForm.coverId = coverId
        this.EditAdCreatives.thumbnailUrl = url
      }
      this.resetSuggestCover()
    },
    resetSuggestCover() {
      this.suggestCoverOp = ''
      this.suggestCreative = {}
      this.openSuggestCover = false
      this.suggestCoverAccount = ''
    },
    handleOpenSuggestCover(row, accountId, op) {
      this.suggestCoverOp = op
      this.suggestCreative = _.cloneDeep(row)
      this.openSuggestCover = true
      this.suggestCoverAccount = accountId
    },
    getEventDataValue(row, itemVal) {
      console.log("row,", row, "item val:", itemVal)
      if (itemVal.includes(".")) {
        let events = itemVal.split(".")
        if (events.length > 1) {
          return row.appEvent[events[1]]
        }
        return "-"
      }
      return row[itemVal]
    },
    openUrl(url) {
      window.open(url)
    },
    closeCallbackBatchAdOps() {
      this.batchAdTitle = ''
      this.batchDialogAdName = []
      this.containACO = false
      this.batchUpdateAdStatusShow = false
      this.batchAdStatus = ''
    },
    callbackBatchAdOps(confirm, data, status) {
      if (confirm) {
        let params = {
          ttAds: data,
          status: status
        }
        this.initErrAdTable(data)
        batchUpdateAdStatus(params).then(res => {
          if (res.data.data.length > 0 && res.data.data[0].ttAdId !== "-1") {
            this.errAdTable = res.data.data
          }
        }).finally(() => {
          this.getAdTableData()
          this.errAdTableShow = true
          this.closeCallbackBatchAdOps()
        })
      } else {
        this.closeCallbackBatchAdOps()
      }
    },
    closeCallbackBatchAdGroupOps() {
      this.batchAdGroupTitle = ''
      this.batchDialogAdGroupName = []
      this.batchUpdateAdGroupStatusShow = false
      this.batchAdGroupStatus = ''
    },
    callbackBatchAdGroupOps(confirm, data, status) {
      if (confirm) {
        let reqParam = {
          adGroupIds: data,
          status: status
        }
        this.initErrAdGroupTable(data)
        batchUpdateAdGroupStatus(reqParam).then((res) => {
          if (res.data.data.length > 0 && res.data.data[0].ttAdgroupId !== "-1") {
            this.errAdGroupTable = res.data.data
          }
        })
          .finally(() => {
            this.$refs.adGroupDataTable.clearSelection()
            this.getAdGroupTableData()
            this.errAdGroupTableShow = true
            this.closeCallbackBatchAdGroupOps()
          })
      } else {
        this.closeCallbackBatchAdGroupOps()
      }
    },
    closeCallbackBatchCampaignOps() {
      this.batchCampaignTitle = ''
      this.batchDialogCampName = []
      this.batchUpdateCampaignStatusShow = false
      this.batchCampaignStatus = ''
    },
    callbackBatchCampaignOps(confirm, data, status) {
      if (confirm) {
        let reqParam = {
          campaignIds: data,
          status: status
        }
        this.initErrCampTable(data)
        batchUpdateCampaignStatus(reqParam)
          .then((res) => {
            if (res.data.data.length > 0 && res.data.data[0].ttCampaignId !== "-1") {
              this.errCampTable = res.data.data
            }
          })
          .finally(() => {
            this.$refs.campaignTableData.clearSelection()
            this.getCampaignTableData()
            this.errCampTableShow = true
            this.closeCallbackBatchCampaignOps()
          })
      } else {
        this.closeCallbackBatchCampaignOps()
      }
    },
    getCreatorName(val) {
      let name = ""
      let copy = _.cloneDeep(this.creatorsList)
      let row = copy.find(item => item.value === val)
      if (row !== undefined) {
        name = _.cloneDeep(row.label)
      }
      return name
    },
    getCreatorList() {
      getCreators(this.offerId).then(res => {
        this.creatorsList = res.data.data
      })
    },
    selectCreators(val) {
      this.queryForm.creators = val
    },
    callbackErrAdGroupTable(success, data) {
      if (success) {
        this.errAdGroupTable = data
      }
      this.errAdGroupTableShow = true
      this.closeAdGroupTargeting()
      this.getAdGroupTableData()
    },
    closeAdGroupTargeting() {
      this.showAdGroupTargeting = false
    },
    selectCampTypeAll() {
      if (this.queryForm.campaignTypes.includes("ALL")) {
        let arr = _.cloneDeep(this.campaignTypeList.map(item => {
          return item.value
        }))
        arr.push("ALL")
        this.queryForm.campaignTypes = arr
      } else {
        this.queryForm.campaignTypes = []
      }
    },
    selectCampTypes(val) {
      if (val.includes("ALL")) {
        let arr = val.filter(item => item !== "ALL")
        if (arr.length === this.campaignTypeList.length - 1) {
          this.queryForm.campaignTypes = arr
        }
      } else {
        if (val.length === this.campaignTypeList.length) {
          val.push("ALL")
          this.queryForm.campaignTypes = val
        }
      }

    },
    handleBatchUpdateAdCommand(cmd) {
      switch (cmd) {
        case "handleBatchStartAd":
          this.handleBatchUpdateAdStatus("ENABLE")
          break
        case "handleBatchStopAd":
          this.handleBatchUpdateAdStatus("DISABLE")
          break
        case "handleBatchUpdateAdNames":
          this.handleBatchUpdateAdNames()
          break
        default:
          break
      }
    },
    handleBatchUpdateAdStatus(status) {
      let rows = _.cloneDeep(this.selectedAds)
      if (rows.length === 0) {
        this.$message.warning("请至少选择一条广告")
        return
      } else if (rows.some(item => item.isSmartPerformanceCampaign === 1)) {
        return this.$message.error('SPC广告不允许操作')
      }
      let data = rows.filter(item => item.ttAdId !== '' && !this.excludeAdStatus.includes(parseInt(item.status)))
      if (data.length === 0) {
        this.$message.warning("当前选中的广告中没有可以修改状态的")
      } else {
        let msg = status === "ENABLE" ? "确认需要开启选择广告吗?" : "确认需要关闭选择广告吗?"
        let acoArr = data.filter(item => item.creativeMaterialMode === 'DYNAMIC')
        if (acoArr.length > 0 && status === "DISABLE") {
          this.containACO = true
        }
        this.batchUpdateAdStatusShow = true
        this.batchDialogAdName = data
        this.batchAdTitle = msg
        this.batchAdStatus = status
        // this.$confirm(msg, "修改广告状态", {
        //   confirmButtonText: '确定',
        //   cancelButtonText: '取消',
        //   type: 'warning'
        // }).then(() => {
        //
        // }).catch(() => {
        //   this.$message.warning("已取消修改")
        // })
      }
    },
    handleBatchUpdateAdNames() {

    },
    sumAdCount() {
      let summary = 0
      this.renderAdList.forEach(item => {
        summary += item.length
      })
      return this.campaignForm.sameCreativesForAdgroup ? summary * this.renderAdGroupList.length : summary
    },
    showTextEditSelection() {
      this.visibleDocs = true
    },
    updateFormalAdText(tx) {
      this.singleEditAdForm.adText = _.cloneDeep(tx)
    },
    formatEditTimezone(tz) {
      if (tz === '') {
        return `+00:00`
      } else {
        if (tz >= 10) {
          return `+${tz}:00`
        } else if (tz >= 0) {
          return `+0${tz}:00`
        } else if (tz > -10) {
          return `-0${Math.abs(tz)}:00`
        } else {
          return `${tz}:00`
        }
      }
    },
    handleImagePreview(creativeUrl) {
      let creative = {}
      creative.type = 0
      creative.creativeUrl = creativeUrl
      this.previewCreative = creative
      this.assetPreview = true
    },
    handlePreview(row) {
      this.previewCreative = _.cloneDeep(row)
      this.assetPreview = true
    },
    closeErrCampTable() {
      this.errCampTableShow = false
      this.errCampTable = []
    },
    closeErrAdGroupTable() {
      this.errAdGroupTableShow = false
      this.errAdGroupTable = []
    },
    closeErrAdTable() {
      this.errAdTableShow = false
      this.errAdTable = []
    },
    initErrAdTable(ls) {
      let data = []
      ls.forEach(item => {
        let param = {
          ttAdId: item.ttAdId !== undefined ? _.cloneDeep(item.ttAdId) : _.cloneDeep(item),
          success: false,
          msg: "调用接口超时"
        }
        data.push(param)
      })
      this.errAdTable = data
    },
    initErrAdGroupTable(ls) {
      let data = []
      ls.forEach(item => {
        let param = {
          ttAdgroupId: item.ttAdgroupId !== undefined ? _.cloneDeep(item.ttAdgroupId) : _.cloneDeep(item),
          success: false,
          msg: "调用接口超时"
        }
        data.push(param)
      })
      this.errAdGroupTable = data
    },
    initErrCampTable(ls) {
      let data = []
      ls.forEach(item => {
        let param = {
          ttCampaignId: item.ttCampaignId !== undefined ? _.cloneDeep(item.ttCampaignId) : _.cloneDeep(item),
          success: false,
          msg: "调用接口超时"
        }
        data.push(param)
      })
      this.errCampTable = data
    },
    intRow(val) {
      if (val) {
        return val.substring(0, val.lastIndexOf('.'))
      } else {
        return ''
      }
    },
    handleCloseCampaigns() {
      // console.log(this.selectedCampaigns)
      // this.selectedCampaigns=[]
      this.$refs.campaignTableData.clearSelection();
      this.getAdGroupTableData()
    },
    handleCloseCampaigns1() {
      // console.log(this.adGroupTableData)
      this.$refs.adGroupDataTable.clearSelection()
      this.getAdTableData()
    },
    renderBCAdgroupBidTable() {
      this.batchUpdateAdGroupBidDisabled = false
      this.batchUpdateBidTips = false
      this.batchUpdateNegTips = false
      if (parseFloat(this.batchUpdateAdgroupBudgetForm.amount) < 0) {
        this.batchUpdateNegTips = true
        this.batchUpdateAdgroupBudgetForm.amount = 0
        return
      }
      if (this.batchUpdateAdgroupBudgetForm.changeMethod === 0) {
        this.batchUpdateAdgroupBudgetForm.changeType = 0
        this.changeTypeMethodDisable = true
      } else {
        this.changeTypeMethodDisable = false
      }
      this.adGroupUpdateBidList.forEach(item => {
        if (this.batchUpdateAdgroupBudgetForm.changeType === 0 && this.batchUpdateAdgroupBudgetForm.changeMethod === 1) {
          item.newBidPrice = parseFloat(item.bidPrice) + parseFloat(this.batchUpdateAdgroupBudgetForm.amount)
        } else if (this.batchUpdateAdgroupBudgetForm.changeType === 0 &&
          this.batchUpdateAdgroupBudgetForm.changeMethod === 2) {
          item.newBidPrice = parseFloat(item.bidPrice) - parseFloat(this.batchUpdateAdgroupBudgetForm.amount)
        } else if (this.batchUpdateAdgroupBudgetForm.changeType === 1
          && this.batchUpdateAdgroupBudgetForm.changeMethod === 1) {
          item.newBidPrice = item.bidPrice * (1 + (this.batchUpdateAdgroupBudgetForm.amount / 100))
        } else if (this.batchUpdateAdgroupBudgetForm.changeType === 1
          && this.batchUpdateAdgroupBudgetForm.changeMethod === 2) {
          item.newBidPrice = item.bidPrice * (1 - (this.batchUpdateAdgroupBudgetForm.amount / 100))
        } else if (this.batchUpdateAdgroupBudgetForm.changeType === 0
          && this.batchUpdateAdgroupBudgetForm.changeMethod === 0) {
          item.newBidPrice = this.batchUpdateAdgroupBudgetForm.amount
        } else {
          item.newBidPrice = (parseFloat(this.batchUpdateAdgroupBudgetForm.amount) / 100) * parseFloat(item.bidPrice)
        }
        if (item.newBidPrice <= 0 && item.editable) {
          item.newBidPrice = 0.01
          this.batchUpdateBidTips = true
        }
        if ((parseFloat(item.newBidPrice) >= parseFloat(item.budget) ||
          parseFloat(item.newBidPrice) >= parseFloat(item.campaignBudget)) && item.editable) {
          item.newBidPrice = item.bidPrice
          this.batchUpdateBidTips = true
        }
        item.newBidPrice = parseFloat(item.newBidPrice).toFixed(2)
      })
    },
    renderSingleBCAdgroupBidTable(row) {
      this.batchUpdateAdGroupBidDisabled = false
      this.batchUpdateBidTips = false
      if (row.newBidPrice <= 0 && row.editable) {
        row.newBidPrice = 0.01
        this.batchUpdateBidTips = true
      }
      if ((parseFloat(row.newBidPrice) >= parseFloat(row.budget) ||
        parseFloat(row.newBidPrice) >= parseFloat(row.campaignBudget)) && row.editable) {
        row.newBidPrice = row.bidPrice
        this.batchUpdateBidTips = true
      }
    },
    renderBCAdgroupBudgetTable() {
      this.batchUpdateAdGroupBudgetDisabled = false
      this.batchUpdateAdGroupBudTips = false
      this.batchUpdateAdGroupNegTips = false
      if (parseFloat(this.batchUpdateAdgroupBudgetForm.amount) < 0) {
        this.batchUpdateAdGroupNegTips = true
        this.batchUpdateAdgroupBudgetForm.amount = 0
        return
      }
      if (this.batchUpdateAdgroupBudgetForm.changeMethod === 0) {
        this.batchUpdateAdgroupBudgetForm.changeType = 0
        this.changeTypeMethodDisable = true
      } else {
        this.changeTypeMethodDisable = false
      }
      this.adGroupBudgetAllTypeList.forEach(item => {
        if (this.batchUpdateAdgroupBudgetForm.changeType === 0 && this.batchUpdateAdgroupBudgetForm.changeMethod === 1) {
          item.newBudget = parseFloat(item.budget) + parseFloat(this.batchUpdateAdgroupBudgetForm.amount)
        } else if (this.batchUpdateAdgroupBudgetForm.changeType === 0 &&
          this.batchUpdateAdgroupBudgetForm.changeMethod === 2) {
          item.newBudget = parseFloat(item.budget) - parseFloat(this.batchUpdateAdgroupBudgetForm.amount)
        } else if (this.batchUpdateAdgroupBudgetForm.changeType === 1
          && this.batchUpdateAdgroupBudgetForm.changeMethod === 1) {
          item.newBudget = item.budget * (1 + (this.batchUpdateAdgroupBudgetForm.amount / 100))
        } else if (this.batchUpdateAdgroupBudgetForm.changeType === 1
          && this.batchUpdateAdgroupBudgetForm.changeMethod === 2) {
          item.newBudget = item.budget * (1 - (this.batchUpdateAdgroupBudgetForm.amount / 100))
        } else if (this.batchUpdateAdgroupBudgetForm.changeType === 0
          && this.batchUpdateAdgroupBudgetForm.changeMethod === 0) {
          item.newBudget = this.batchUpdateAdgroupBudgetForm.amount
        } else {
          item.newBudget = (parseFloat(this.batchUpdateAdgroupBudgetForm.amount) / 100) * parseFloat(item.budget)
        }

        if (item.newBudget < item.minBudget && item.editable) {
          item.newBudget = item.minBudget
          this.batchUpdateAdGroupBudTips = true
        }
        item.newBudget = parseFloat(item.newBudget).toFixed(2)
      })
    },
    renderSingleBCAdgroupBudgetTable(row) {
      this.batchUpdateAdGroupBudgetDisabled = false
      this.batchUpdateAdGroupBudTips = false
      if (row.newBudget < row.minBudget && row.editable) {
        row.newBudget = row.minBudget
        this.batchUpdateAdGroupBudTips = true
      }
    },
    renderSingleBCBudgetTable(row) {
      this.batchUpdateCampBudgetDisabled = false
      this.batchUpdateCampBudTips = false
      if (row.newBudget < 50) {
        row.newBudget = 50
        this.batchUpdateCampBudTips = true
      }
    },
    renderBCBudgetTable() {
      this.batchUpdateCampBudgetDisabled = false
      this.batchUpdateCampBudTips = false
      this.batchUpdateCampNegTips = false
      if (parseFloat(this.batchUpdateAdgroupBudgetForm.amount) < 0) {
        this.batchUpdateCampNegTips = true
        this.batchUpdateAdgroupBudgetForm.amount = 0
        return
      }
      if (this.batchUpdateAdgroupBudgetForm.changeMethod === 0) {
        this.batchUpdateAdgroupBudgetForm.changeType = 0
        this.changeTypeMethodDisable = true
      } else {
        this.changeTypeMethodDisable = false
      }
      this.campUpdateBudgetList.forEach(item => {
        if (this.batchUpdateAdgroupBudgetForm.changeType === 0 && this.batchUpdateAdgroupBudgetForm.changeMethod === 1) {
          item.newBudget = parseFloat(item.budget) + parseFloat(this.batchUpdateAdgroupBudgetForm.amount)
        } else if (this.batchUpdateAdgroupBudgetForm.changeType === 0 &&
          this.batchUpdateAdgroupBudgetForm.changeMethod === 2) {
          item.newBudget = parseFloat(item.budget) - parseFloat(this.batchUpdateAdgroupBudgetForm.amount)
        } else if (this.batchUpdateAdgroupBudgetForm.changeType === 1
          && this.batchUpdateAdgroupBudgetForm.changeMethod === 1) {
          item.newBudget = item.budget * (1 + (this.batchUpdateAdgroupBudgetForm.amount / 100))
        } else if (this.batchUpdateAdgroupBudgetForm.changeType === 1
          && this.batchUpdateAdgroupBudgetForm.changeMethod === 2) {
          item.newBudget = item.budget * (1 - (this.batchUpdateAdgroupBudgetForm.amount / 100))
        } else if (this.batchUpdateAdgroupBudgetForm.changeType === 0
          && this.batchUpdateAdgroupBudgetForm.changeMethod === 0) {
          item.newBudget = this.batchUpdateAdgroupBudgetForm.amount
        } else {
          item.newBudget = (parseFloat(this.batchUpdateAdgroupBudgetForm.amount) / 100) * parseFloat(item.budget)
        }

        if ((item.newBudget < 50 || item.newBudget > 10000000) && item.editable) {
          item.newBudget = 50
          this.batchUpdateCampBudTips = true
        }
        item.newBudget = parseFloat(item.newBudget).toFixed(2)
      })
    },
    getOpGoalName(op) {
      let opGoal = ""
      this.curOptimizationGoalList.forEach(item => {
        if (item.value === op) {
          opGoal = item.label
          return opGoal
        }
      })
      return opGoal
    },
    changeCampaignBudget(row) {
      if (row.budget <= 0) return row.budget = row.oldBudget
      row.showBudget = 0
      this.$confirm("您确定将广告系列：" + row.campaignName + " 的预算修改为 " + row.budget + " 吗？",
        {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        }).then(() => {
        if (row.budget < 50) {
          row.budget = row.oldBudget
          this.$message({message: "广告系列预算不能少于50", type: "warning"})
        } else {
          updateCampaignBudget(row.id, parseFloat(row.budget)).then(res => {
            if (res.data.data === true) {
              this.$message.success("更新成功！")
              row.oldBudget = row.budget
            } else {
              this.$message.error("更新失败！")
            }
          })
        }
      }).catch(action => {
        row.budget = row.oldBudget
      })
    },
    showEditCampaignBudget(row) {
      this.campaignBudget = true
    },
    changeAdgroupBudget(row) {
      if (row.budget <= 0) return row.budget = row.oldBudget
      row.showBudget = 0
      this.$confirm("您确定将广告组：" + row.adgroupName + " 的预算修改为 " + row.budget + " 吗？",
        {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        }).then(() => {
        updateAdgroupBudget(row.id, parseFloat(row.budget)).then(res => {
          if (res.data.data) {
            this.$message.success("更新成功！")
          } else {
            this.$message.error("更新失败！")
          }
        })
      })
    },
    changeAdgroupBid(row) {
      row.showBids = 0
      let newBid;
      let oldBid;
      if (row.optimizationGoal === 'CLICK') {
        newBid = row.bidPrice
        oldBid = row.oldBidPrice
      } else {
        newBid = row.conversionBidPrice
        oldBid = row.oldConversionBidPrice
      }
      if (newBid.budget <= 0) return row.bidPrice = oldBid
      if (newBid >= 50) {
        this.$confirm("当前出价超过50，您确定将广告组：" + row.adgroupName + " 的出价修改为 " + newBid + " 吗？",
          {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning"
          }).then(() => {
          if (parseFloat(newBid) >= parseFloat(row.budget)) {
            this.$message({message: "广告组出价必须小于广告组预算!", type: "warning"})
            if (row.optimizationGoal === 'CLICK') {
              row.bidPrice = oldBid
            } else {
              row.conversionBidPrice = oldBid
            }
          } else if (parseFloat(newBid) >= parseFloat(row.campaignBudget) && row.campaignBudgetMode !== 'BUDGET_MODE_INFINITE') {
            this.$message({message: "广告组出价必须小于广告组系列预算!", type: "warning"})
            if (row.optimizationGoal === 'CLICK') {
              row.bidPrice = oldBid
            } else {
              row.conversionBidPrice = oldBid
            }
          } else {
            if (parseFloat(newBid) > 0) {
              updateAdgroupBid(row.id, parseFloat(newBid)).then(res => {
                // if (res.data.data === true) {
                this.$message.success("更新成功！")
                // } else {
                //   this.$message.error("更新失败！")
                // }
                if (row.optimizationGoal === 'CLICK') {
                  row.oldBidPrice = newBid
                } else {
                  row.oldConversionBidPrice = newBid
                }
              })
            } else {
              this.$message({message: "出价不能小于等于0!", type: "warning"})
              if (row.optimizationGoal === 'CLICK') {
                row.bidPrice = oldBid
              } else {
                row.conversionBidPrice = oldBid
              }
            }
          }
        }).finally(() => {
          this.$refs.campaignTableData.clearSelection()
          this.getAdGroupTableData()
          this.$forceUpdate() // 强制刷新组件
        })
      } else {
        this.$confirm("您确定将广告组：" + row.adgroupName + " 的出价修改为 " + newBid + " 吗？",
          {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning"
          }).then(() => {
          if (parseFloat(newBid) >= parseFloat(row.budget)) {
            this.$message({message: "出价必须小于预算!", type: "warning"})
            if (row.optimizationGoal === 'CLICK') {
              row.bidPrice = oldBid
            } else {
              row.conversionBidPrice = oldBid
            }
          } else {
            if (parseFloat(newBid) > 0) {
              updateAdgroupBid(row.id, parseFloat(newBid)).then(res => {
                // if (res.data.data === true) {
                this.$message.success("更新成功！")
                this.$forceUpdate() // 强制刷新组件
                this.getAdGroupTableData()
                // } else {
                //   this.$message.error("更新失败！")
                // }
              })
            } else {
              this.$message({message: "出价不能小于等于0!", type: "warning"})
              if (row.optimizationGoal === 'CLICK') {
                row.bidPrice = oldBid
              } else {
                row.conversionBidPrice = oldBid
              }
            }
          }
        }).finally(() => {
          this.$refs.campaignTableData.clearSelection()
        })

      }
    },
    handleBatchStartCampaign() {
      if (this.selectedCampaigns.length === 0) {
        this.$message("至少选择一条推广系列记录")
      } else {
        let campaigns = []
        this.selectedCampaigns.forEach(item => {
          if (!this.excludeCampaignStatus.includes(parseInt(item.status)) && item.ttCampaignId !== '') {
            let param = {
              platformId: item.platformId,
              ttCampaignId: item.ttCampaignId,
              campaignName: item.campaignName
            }
            campaigns.push(param)
          }
        })
        if (campaigns.length === 0) {
          this.$message("至少选择一条有效的推广系列记录")
          this.$refs.campaignTableData.clearSelection()
          this.getAdGroupTableData()
        } else {
          this.batchDialogCampName = campaigns
          this.batchCampaignTitle = "确定开启下面的推广系列吗?"
          this.batchCampaignStatus = "ENABLE"
          this.batchUpdateCampaignStatusShow = true
        }
      }
    },
    handleBatchStopCampaign() {
      if (this.selectedCampaigns.length === 0) {
        this.$message("至少选择一条推广系列记录")
      } else {
        let campaigns = []
        this.selectedCampaigns.forEach(item => {
          if (!this.excludeCampaignStatus.includes(parseInt(item.status)) && item.ttCampaignId !== "") {
            let param = {
              platformId: item.platformId,
              ttCampaignId: item.ttCampaignId,
              campaignName: item.campaignName
            }
            campaigns.push(param)
          }
        })
        if (campaigns.length === 0) {
          this.$message("至少选择一条有效的推广系列记录")
          this.$refs.campaignTableData.clearSelection()
          this.getAdGroupTableData()
        } else {
          this.batchDialogCampName = campaigns
          this.batchCampaignTitle = "确定暂停下面的推广系列吗?"
          this.batchCampaignStatus = "DISABLE"
          this.batchUpdateCampaignStatusShow = true
        }
      }
    },
    handleBatchUpdateCampaignCommand(cmd) {
      switch (cmd) {
        case "handleBatchStartCampaign":
          this.handleBatchStartCampaign()
          break
        case "handleBatchStopCampaign":
          this.handleBatchStopCampaign()
          break
        case "handleBatchUpdateCampNames":
          this.handleBatchUpdateCampNames()
          break
        case "handleBatchUpdateCampBudget":
          this.handleBatchUpdateCampBudget()
          break
        default:
          break
      }
    },
    handleBatchUpdateAdGroupCommand(cmd) {
      switch (cmd) {
        case "handleBatchUpdateBudget":
          this.handleBatchUpdateBudget()
          break
        case "handleBatchStartAdGroup":
          this.handleBatchStartAdGroup()
          break
        case "handleBatchStopAdGroup":
          this.handleBatchStopAdGroup()
          break
        case "handleBatchUpdateAdGroupNames":
          this.handleBatchUpdateAdGroupNames()
          break
        case "handleBatchUpdateAdGroupBids":
          this.handleBatchUpdateAdGroupBids()
          break
        case "handleBatchUpdateAdGroupTargeting":
          this.handleBatchUpdateAdGroupTargeting()
          break
        default:
          break
      }
    },
    handleBatchUpdateAdGroupTargeting() {
      if (this.selectedAdGroups.length === 0) {
        this.$message.error("至少选择一条广告组记录")
      } else if (this.selectedAdGroups.some(item => item.isSmartPerformanceCampaign === 1)) {
        return this.$message.error('SPC广告组不允许操作')
      } else {
        let rows = _.cloneDeep(this.selectedAdGroups)
        rows = rows.filter(item => item.ttAdgroupId !== "" && item.status !== 6)
        if (rows.length === 0) {
          this.$message.error("至少选择一条有效的广告组记录")
          return
        }
        this.adGroupTargets = rows
        this.initErrAdGroupTable(rows)
        this.showAdGroupTargeting = true
      }
    },
    handleBatchUpdateAdGroupBids() {
      if (this.selectedAdGroups.length === 0) {
        this.$message("至少选择一条广告组记录")
      } else if (this.selectedAdGroups.some(item => item.isSmartPerformanceCampaign === 1)) {
        return this.$message.error('SPC广告组不允许操作')
      } else {
        this.showBatchUpdateBid = true
        this.showBatchUpdateBidLoading = true
        let selectedAdGroupData = _.cloneDeep(this.selectedAdGroups)
        let params = this.buildAdGroupEventDTO(selectedAdGroupData)
        getAdgroupCost(params).then(res => {
          if (res.data.data !== undefined && res.data.data !== null) {
            selectedAdGroupData.forEach(item => {
              if (item.ttAdgroupId !== "") {
                if (item.ttAdgroupId in res.data.data) {
                  item.spend = res.data.data[item.ttAdgroupId]
                } else {
                  item.spend = 0
                }
              } else {
                item.spend = 0
              }
            })
          }
        }).finally(() => {
          this.showBatchUpdateBidLoading = false
          selectedAdGroupData.forEach(item => {
            let bidPrice = 0
            if (item.optimizationGoal === "CLICK") {
              bidPrice = item.bidPrice === null ? 0 : item.bidPrice
            } else {
              bidPrice = item.conversionBidPrice === null ? 0 : item.conversionBidPrice
            }
            let editable = item.ttAdgroupId !== '' && item.ttAdgroupId !== null && item.bidType !== 'BID_TYPE_NO_BID'
              && item.budget !== null && !this.excludeAdGroupStatus.includes(parseInt(item.status))
            let bud = {
              ttAdgroupId: item.ttAdgroupId,
              bidPrice: bidPrice,
              newBidPrice: bidPrice,
              budget: item.budget,
              billingEvent: item.billingEvent,
              platformId: item.platformId,
              optimizationGoal: item.optimizationGoal,
              bidType: item.bidType,
              adgroupName: item.adgroupName,
              spend: item.spend === '' ? 0 : item.spend,
              campaignBudget: item.campaignBudgetMode === 'BUDGET_MODE_INFINITE' ? "10000000.0" : item.campaignBudget,
              editable: editable
            }
            this.adGroupUpdateBidList.push(bud)
          })
          if (this.adGroupUpdateBidList.length === 0) {
            this.$message("请至少选择一条有效的数据")
            this.closeBatchUpdateBid()
          }
        })
      }
    },
    closeBatchUpdateBid() {
      this.adGroupUpdateBidList = []
      this.batchUpdateAdgroupBudgetForm.amount = 0
      this.batchUpdateAdgroupBudgetForm.changeType = 0
      this.batchUpdateAdgroupBudgetForm.changeMethod = 0
      this.showBatchUpdateBid = false
      this.batchUpdateBidTips = false
      // this.$refs.adGroupDataTable.clearSelection()
    },
    submitBatchUpdateAdGroupBidConfirm() {
      if (this.batchUpdateAdGroupBidLoading) return
      if (this.adGroupUpdateBidList.some(item => item.newBidPrice >= 50)) {
        this.$confirm('已有出价超过50, 是否继续修改?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning',
          modal: false
        }).then(() => {
          this.submitBatchUpdateAdGroupBid()
        }).catch(() => {
          // this.showBatchUpdateBid = false
        });
      } else {
        this.submitBatchUpdateAdGroupBid()
      }
    },
    submitBatchUpdateAdGroupBid() {
      let params = []
      this.adGroupUpdateBidList.forEach(item => {
        if (item.editable) {
          params.push(item)
        }
      })
      if (params.length === 0) {
        this.$message.warning("批量修改出价失败, 至少要有一列可修改的数据")
        this.closeBatchUpdateBid()
        return
      }
      this.batchUpdateAdGroupBidLoading = true
      this.initErrAdGroupTable(this.adGroupUpdateBidList)
      batchUpdateAdgroupBid(params).then((res) => {
        if (res.data.data.length > 0 && res.data.data[0].ttAdgroupId !== "-1") {
          this.errAdGroupTable = res.data.data
        }
      }).finally(() => {
        this.closeBatchUpdateBid()
        this.batchUpdateAdGroupBidLoading = false
        // this.getAdGroupTableData()
        this.errAdGroupTableShow = true
      })
    },
    handleBatchUpdateCampBudget() {
      if (this.selectedCampaigns.length === 0) {
        this.$message("至少选择一条推广系列记录")
      } else {
        this.showBatchUpdateCampBudget = true
        this.showBatchUpdateCampBudgetLoading = true
        let selectedAdGroupData = _.cloneDeep(this.selectedCampaigns)
        let param = this.buildEventDTO(selectedAdGroupData)
        getCampaignCost(param).then((res) => {
          if (res.data.data !== undefined && res.data.data !== null) {
            selectedAdGroupData.forEach(item => {
              if (item.ttCampaignId !== "") {
                if (item.ttCampaignId in res.data.data) {
                  item.spend = res.data.data[item.ttCampaignId]
                } else {
                  item.spend = 0
                }
              } else {
                item.spend = 0
              }
            })
          }
        }).finally(
          () => {
            this.showBatchUpdateCampBudgetLoading = false
            selectedAdGroupData.forEach(item => {
              let editable = item.ttCampaignId !== '' && item.ttCampaignId !== null &&
                item.budgetMode !== 'BUDGET_MODE_INFINITE' && !this.excludeCampaignStatus(parseInt(item.status))
              let bud = {
                ttCampaignId: item.ttCampaignId,
                budget: item.budget,
                budgetMode: item.budgetMode,
                platformId: item.platformId,
                newBudget: item.budget,
                campaignName: item.campaignName,
                spend: item.spend === '' || item.spend === null ? 0 : item.spend,
                editable: editable
              }
              if (item.budgetMode === "BUDGET_MODE_DAY") {
                this.campUpdateBudgetDayList.push(bud)
              } else if (item.budgetMode === "BUDGET_MODE_TOTAL") {
                this.campUpdateBudgetTotalList.push(bud)
              } else {
                this.campUpdateBudgetList.push(bud)
              }
            })
            this.campUpdateBudgetList =
              [...this.campUpdateBudgetDayList, ...this.campUpdateBudgetTotalList, ...this.campUpdateBudgetList]
            if ((this.campUpdateBudgetDayList.length +
              this.campUpdateBudgetTotalList.length) === 0) {
              this.$message("请至少选择一条有效的数据")
              this.closeBatchUpdateCampBudget()
            }
          }
        )
      }
    },
    buildEventDTO(arrs) {
      let advs = []
      let ttIds = []
      arrs.forEach(item => {
        if (item.ttCampaignId !== '') {
          ttIds.push(item.ttCampaignId)
          if (!advs.includes(item.platformId)) {
            advs.push(item.platformId)
          }
        }
      })
      return {
        "advertiserId": advs,
        "metricsList": ["spend"],
        "filterIds": ttIds.join(","),
        "level": "campaign_id",
        "startDate": this.transformQueryAudienceDate.startTime,
        "endDate": this.transformQueryAudienceDate.endTime,
      }
    },
    closeBatchUpdateCampBudget() {
      this.campUpdateBudgetList = []
      this.campUpdateBudgetDayList = []
      this.campUpdateBudgetTotalList = []
      this.batchUpdateCampBudTips = false
      this.batchUpdateCampNegTips = false
      this.batchUpdateAdgroupBudgetForm.amount = 0
      this.batchUpdateAdgroupBudgetForm.changeType = 0
      this.batchUpdateAdgroupBudgetForm.changeMethod = 0
      this.showBatchUpdateCampBudget = false
      // this.$refs.campaignTableData.clearSelection()
    },
    submitBatchUpdateCampBudget() {
      if (this.batchUpdateCampBudgetLoading) return
      let params = []
      this.campUpdateBudgetList.forEach(item => {
        if (item.editable) {
          params.push(item)
        }
      })
      if (params.length === 0) {
        this.$message.warning("批量修改预算失败, 至少要有一列可修改的数据")
        this.closeBatchUpdateCampBudget()
        return
      }
      this.batchUpdateCampBudgetLoading = true
      this.initErrCampTable(params)
      batchUpdateCampaignBudget(params).then((res) => {
        if (res.data.data.length > 0 && res.data.data[0].ttCampaignId !== "-1") {
          this.errCampTable = res.data.data
        }
      }).finally(() => {
        this.closeBatchUpdateCampBudget()
        this.batchUpdateCampBudgetLoading = false
        // this.getCampaignTableData()
        this.errCampTableShow = true
      })
    },
    handleBatchUpdateAdGroupNames() {
      if (this.selectedAdGroups.length === 0) {
        this.$message("至少选择一条广告组记录")
      } else if (this.selectedAdGroups.some(item => item.isSmartPerformanceCampaign === 1)) {
        return this.$message.error('SPC广告组不允许操作')
      } else {
        this.showBatchUpdateAdGroupName = true
        this.showBatchUpdateAdGroupNameLoading = true
        let selectedAdGroupData = _.cloneDeep(this.selectedAdGroups)
        let params = this.buildAdGroupEventDTO(selectedAdGroupData)
        getAdgroupCost(params).then(res => {
          if (res.data.data !== undefined && res.data.data !== null) {
            selectedAdGroupData.forEach(item => {
              if (item.ttAdgroupId !== "") {
                if (item.ttAdgroupId in res.data.data) {
                  item.spend = res.data.data[item.ttAdgroupId]
                } else {
                  item.spend = 0
                }
              } else {
                item.spend = 0
              }
            })
          }
        }).finally(() => {
          this.showBatchUpdateAdGroupNameLoading = false
          selectedAdGroupData.forEach(item => {
            if (item.ttAdgroupId !== '' && !this.excludeAdGroupStatus.includes(parseInt(item.status))) {
              let bud = {
                ttAdgroupId: item.ttAdgroupId,
                adgroupName: item.adgroupName,
                platformId: item.platformId,
                newAdgroupName: item.adgroupName,
                spend: item.spend === '' ? 0 : item.spend
              }
              this.adGroupUpdateNames.push(bud)
            }
          })
          if (this.adGroupUpdateNames.length === 0) {
            this.$message("请至少选择一条有效的数据")
            this.closeBatchUpdateAdgroupNames()
          } else {
            this.$nextTick(() => {
              this.$refs.batchEditInput0.focus()
            })
          }
        })
      }
    },
    closeBatchUpdateAdgroupNames() {
      this.adGroupUpdateNames = []
      this.showBatchUpdateAdGroupName = false
      this.batchUpdateNameBtnLoading = false
      this.getAdGroupTableData()
    },
    submitBatchUpdateAdGroupNames() {
      this.batchUpdateNameBtnLoading = true
      this.initErrAdGroupTable(this.adGroupUpdateNames)
      batchUpdateAdgroupNames(this.adGroupUpdateNames).then((res) => {
        if (res.data.data.length > 0 && res.data.data[0].ttAdgroupId !== "-1") {
          this.errAdGroupTable = res.data.data
        }
      }).finally(() => {
        this.closeBatchUpdateAdgroupNames()
        this.errAdGroupTableShow = true
      })
    },
    buildAdGroupEventDTO(arrs) {
      let advs = []
      let ttIds = []
      arrs.forEach(item => {
        if (item.ttAdgroupId !== '') {
          ttIds.push(item.ttAdgroupId)
          if (!advs.includes(item.platformId)) {
            advs.push(item.platformId)
          }
        }
      })
      return {
        "advertiserId": advs,
        "metricsList": ["spend"],
        "filterIds": ttIds.join(","),
        "level": "adgroup_id",
        "startDate": this.transformQueryAudienceDate.startTime,
        "endDate": this.transformQueryAudienceDate.endTime,
      }
    },
    handleBatchUpdateCampNames() {
      if (this.selectedCampaigns.length === 0) {
        this.$message("至少选择一条广告组记录")
      } else {
        this.showBatchUpdateCampNames = true
        this.showBatchUpdateCampBudgetLoading = true
        let selectedCampData = _.cloneDeep(this.selectedCampaigns)
        let param = this.buildEventDTO(selectedCampData)
        getCampaignCost(param).then((res) => {
          if (res.data.data !== undefined && res.data.data !== null) {
            selectedCampData.forEach(item => {
              if (item.ttCampaignId !== "") {
                if (item.ttCampaignId in res.data.data) {
                  item.spend = res.data.data[item.ttCampaignId]
                } else {
                  item.spend = 0
                }
              } else {
                item.spend = 0
              }
            })
          }
        }).finally(() => {
          this.showBatchUpdateCampBudgetLoading = false
          selectedCampData.forEach(item => {
            let editable = item.ttCampaignId !== '' && !this.excludeCampaignStatus.includes(parseInt(item.status))
            let bud = {
              ttCampaignId: item.ttCampaignId,
              campaignName: item.campaignName,
              platformId: item.platformId,
              newCampName: item.campaignName,
              spend: item.spend === '' ? 0 : item.spend,
              editable: editable,
            }
            this.campUpdateNames.push(bud)
          })
          if (this.campUpdateNames.length === 0) {
            this.$message("请至少选择一条有效的数据")
            this.closeBatchUpdateCampNames()
          }
        })
      }
    },
    submitBatchUpdateCampNames() {
      this.batchUpdateNameBtnLoading = true
      this.initErrCampTable(this.campUpdateNames)
      batchUpdateCampaignNames(this.campUpdateNames).then((res) => {
        if (res.data.data.length > 0 && res.data.data[0].ttCampaignId !== "-1") {
          this.errCampTable = res.data.data
        }
      }).finally(() => {
        this.closeBatchUpdateCampNames()
        this.errCampTableShow = true
      })
    },
    closeBatchUpdateCampNames() {
      this.campUpdateNames = []
      this.showBatchUpdateCampNames = false
      this.batchUpdateNameBtnLoading = false
      this.getCampaignTableData()
    },
    handleBatchStopAdGroup() {
      if (this.selectedAdGroups.length === 0) {
        this.$message("至少选择一条广告组记录")
      } else if (this.selectedAdGroups.some(item => item.isSmartPerformanceCampaign === 1)) {
        return this.$message.error('SPC广告组不允许操作')
      } else {
        let adGroups = []
        this.selectedAdGroups.forEach(item => {
          if (item.ttAdgroupId !== "" && !this.excludeAdGroupStatus.includes(parseInt(item.status))) {
            let param = {
              platformId: item.platformId,
              ttAdgroupId: item.ttAdgroupId,
              adgroupName: item.adgroupName
            }
            adGroups.push(param)
          }
        })
        if (adGroups.length === 0) {
          this.$message("至少选择一条有效的广告组记录")
          this.$refs.adGroupDataTable.clearSelection()
          this.getAdGroupTableData()
        } else {
          this.batchDialogAdGroupName = adGroups
          this.batchAdGroupTitle = "确定暂停下面的广告组吗?"
          this.batchAdGroupStatus = "DISABLE"
          this.batchUpdateAdGroupStatusShow = true
        }
      }
    },
    handleBatchStartAdGroup() {
      if (this.selectedAdGroups.length === 0) {
        this.$message("至少选择一条广告组记录")
      } else if (this.selectedAdGroups.some(item => item.isSmartPerformanceCampaign === 1)) {
        return this.$message.error('SPC广告组不允许操作')
      } else {
        let adGroups = []
        this.selectedAdGroups.forEach(item => {
          if (item.ttAdgroupId !== "" && !this.excludeAdGroupStatus.includes(parseInt(item.status))) {
            let param = {
              platformId: item.platformId,
              ttAdgroupId: item.ttAdgroupId,
              adgroupName: item.adgroupName
            }
            adGroups.push(param)
          }
        })
        if (adGroups.length === 0) {
          this.$message("至少选择一条有效的广告组记录")
          this.$refs.adGroupDataTable.clearSelection()
          this.getAdGroupTableData()
        } else {
          this.batchDialogAdGroupName = adGroups
          this.batchAdGroupTitle = "确定开启下面的广告组吗?"
          this.batchAdGroupStatus = "ENABLE"
          this.batchUpdateAdGroupStatusShow = true
        }
      }
    },
    submitBatchUpdateAdGroupBudget() {
      if (this.batchUpdateAdGroupBudgetLoading) return
      let params = []
      this.adGroupBudgetAllTypeList.forEach(item => {
        if (item.editable) {
          params.push(item)
        }
      })
      if (params.length === 0) {
        this.$message.warning("批量修改预算失败, 至少要有一列可修改的数据")
        this.closeBatchUpdateBudget()
        return
      }
      this.batchUpdateAdGroupBudgetLoading = true
      this.initErrAdGroupTable(params)
      batchUpdateAdGroupBudget(params).then((res) => {
        if (res.data.data.length > 0 && res.data.data[0].ttAdgroupId !== "-1") {
          this.errAdGroupTable = res.data.data
        }
      }).finally(() => {
        this.closeBatchUpdateBudget()
        this.batchUpdateAdGroupBudgetLoading = false
        // this.getAdGroupTableData()
        this.errAdGroupTableShow = true
      })
    },
    closeBatchUpdateBudget() {
      this.showBatchUpdateBudget = false
      this.batchUpdateAdgroupBudgetForm.amount = 0
      this.batchUpdateAdgroupBudgetForm.changeType = 0
      this.batchUpdateAdgroupBudgetForm.changeMethod = 0
      this.batchUpdateAdGroupBudTips = false
      this.batchUpdateAdGroupNegTips = false
      this.adGroupBudgetDayList = []
      this.adGroupBudgetTotalList = []
      this.adGroupBudgetDisableList = []
      this.adGroupBudgetAllTypeList = []
      // this.$refs.adGroupDataTable.clearSelection()
    },
    handleBatchUpdateBudget() {
      if (this.selectedAdGroups.length === 0) {
        this.$message("至少选择一条广告组记录")
      } else if (this.selectedAdGroups.some(item => item.isSmartPerformanceCampaign === 1)) {
        return this.$message.error('SPC广告组不允许操作')
      } else {
        this.showBatchUpdateBudget = true
        this.showBatchUpdateBudgetLoading = true
        let selectedAdGroupData = _.cloneDeep(this.selectedAdGroups)
        let param = this.buildAdGroupEventDTO(selectedAdGroupData)
        getAdgroupCost(param).then((res) => {
          if (res.data.data !== undefined && res.data.data !== null) {
            selectedAdGroupData.forEach(item => {
              if (item.ttCampaignId !== "") {
                if (item.ttCampaignId in res.data.data) {
                  item.spend = res.data.data[item.ttCampaignId]
                } else {
                  item.spend = 0
                }
              } else {
                item.spend = 0
              }
            })
          }
        }).finally(() => {
          this.showBatchUpdateBudgetLoading = false
          selectedAdGroupData.forEach(item => {
            let editable = item.ttAdgroupId !== '' && item.ttAdgroupId !== null
              && item.budgetMode !== 'BUDGET_MODE_INFINITE' && item.scheduleStartTime !== ''
            let bud = {
              ttAdgroupId: item.ttAdgroupId,
              budget: item.budget,
              budgetMode: item.budgetMode,
              platformId: item.platformId,
              newBudget: item.budget,
              adgroupName: item.adgroupName,
              spend: item.spend === '' ? 0 : item.spend,
              minBudget: 20,
              editable: editable
            }
            if (item.budgetMode === "BUDGET_MODE_DAY") {
              this.adGroupBudgetDayList.push(bud)
            } else if (item.budgetMode === "BUDGET_MODE_TOTAL") {
              bud.minBudget = this.countBudgetForEditDays(item.scheduleStartTime, item.scheduleEndTime)
              this.adGroupBudgetTotalList.push(bud)
            } else {
              this.adGroupBudgetDisableList.push(bud)
            }
          })
          this.adGroupBudgetAllTypeList =
            [...this.adGroupBudgetDayList, ...this.adGroupBudgetTotalList, ...this.adGroupBudgetDisableList]
          if ((this.adGroupBudgetDayList.length +
            this.adGroupBudgetTotalList.length +
            this.adGroupBudgetDisableList.length) === 0) {
            this.$message("请至少选择一条有效的数据")
            this.closeBatchUpdateBudget()
          }
        })
      }
    },
    addEditIdentity() {
      if (this.addIdentityLoading) return
      this.$refs.identityForm.validate(async valid => {
        if (!valid) return
        this.addIdentityLoading = true
        const {data: res} = await createTtIdentityByAdGroup({
          adGroupId: this.singleEditAdForm.adGroupId,
          displayName: this.identityForm.value,
          logoUrl: this.logoUrl
        }).finally(() => {
          this.addIdentityLoading = false
        })
        await this.getIdentityList()
        this.identityForm.value = ''
        this.addIdentityDialog = false
      })
    },
    clearEditCreativeQuery() {
      this.creativeQueryForm = {
        shortId: '',
        localFilename: '',
        name: '',
        date: '',
        beginDate: null,
        endDate: null,
        sizeType: '',
        requestName: '',
        strStatus: [1, 2],
        designer: '',
        beginAuditDate: ''
      }
      this.getCreativeEditTableData()
    },
    handleChangeAdCreative(row) {
      this.EditAdCreatives = row
      this.editFromStroeDrawer = false
    },
    handleOpenEditCreative() {
      this.editFromStroeDrawer = true
      this.getCreativeEditTableData()
    },
    async getCreativeEditTableData() {
      this.creativeLoading = true
      const creativeQueryForm = _.cloneDeep(this.creativeQueryForm)
      creativeQueryForm.type = this.singleEditAdForm.adFormat === 'SINGLE_VIDEO' ? "1" : "0"
      creativeQueryForm.strStatus = creativeQueryForm.strStatus.join(',')
      const {data: res} = await offerCreativePage(
        {
          offerId: this.offerId,
          platform: 'tiktok',
          ...this.creativePage,
          ...creativeQueryForm
        }
      ).finally(() => {
        this.creativeLoading = false
      })
      this.creativeTableData = res.data.records
      this.creativeTotal = res.data.total
    },
    getAdFormText(adform) {
      if (adform === "SINGLE_VIDEO") {
        return "单视频";
      }
      if (adform === "SINGLE_IMAGE") {
        return "单图片";
      }
      return ""
    },
    getEditIdentityList(refresh, adGroupId, platformAppId) {
      this.editIdentityListLoading = true
      getTtIdentityByAdGroup({
        refresh: refresh || false,
        adGroupId: adGroupId,
        // platformId: '7141256560222715905',
        platformAppId
      }).then((res) => {
        this.identityList = res.data.data
        this.initIdentityList()
      }).catch((err) => {
        this.$message("加载身份失败, ", err)
      })
    },
    changeAcoCreatives(val) {
      this.singleEditAdForm.acoCreatives = val
    },
    changeCTAVals(val) {
      this.singleEditAdForm.acoCTAs = val
    },
    changeDocs(val) {
      this.singleEditAdForm.acoAdTexts = val
    },
    verifyAcoParams() {
      let result = {
        valid: false,
        msg: "",
        dup: false
      }
      if (this.editAdIdentityId === undefined || this.editAdIdentityId === '') {
        result.msg = "请选择一个有效的身份"
        return result
      }
      let findDuplicates = arr => arr.filter((item, index) => arr.indexOf(item) != index)
      let dups = findDuplicates(this.singleEditAdForm.acoAdTexts)
      if (dups.length > 0) {
        result.msg = "文案不能有重复"
        return result
      }
      let findEmptyDocs = arr => arr.filter((item) => item === undefined || item === null || item === "")
      let emptyDocs = findEmptyDocs(this.singleEditAdForm.acoAdTexts)
      if (emptyDocs.length > 0) {
        result.msg = "文案不能为空"
        return result
      }
      let areEqual = (a, b) =>
        (a === b) || (a.length === b.length && !a.some((x, i) => x !== b[i]));
      if (this.singleEditAdForm.acoCreatives.length === this.singleEditAdForm.oldAcoCreatives.length
        && this.singleEditAdForm.acoAdTexts.length === this.singleEditAdForm.oldAcoAdTexts.length
        && this.singleEditAdForm.acoCTAs.length === this.singleEditAdForm.oldAcoCTAs.length) {
        let newCids = this.singleEditAdForm.acoCreatives.map(item => {
          return item.id
        })
        let oldCids = this.singleEditAdForm.oldAcoCreatives.map(item => {
          return item.id
        })
        let ctaTypeEq = this.singleEditAdForm.oldCTAType === this.singleEditAdForm.callToActionType
        let cvEq = areEqual(newCids, oldCids)
        let coverEq = false
        if (cvEq) {
          const mapsAreEqual =
            (m1, m2) => m1.size === m2.size && Array.from(m1.keys()).every((key) => m1.get(key) === m2.get(key));
          coverEq = mapsAreEqual(this.editAcoCoverMap, this.singleEditAdForm.oldCoverMap)
        }
        let textEq = areEqual(this.singleEditAdForm.acoAdTexts, this.singleEditAdForm.oldAcoAdTexts)
        let ctaEq = areEqual(this.singleEditAdForm.acoCTAs, this.singleEditAdForm.oldAcoCTAs)
        if (cvEq && textEq && ctaEq && ctaTypeEq && coverEq) {
          result.valid = true
          result.dup = true
          return result
        }
      }
      result.valid = true
      return result
    },
    submitEditAds() {
      this.$refs["singleEditAdForm"].validate((valid) => {
        if (valid) {
          if (this.isACO) {
            let result = this.verifyAcoParams()
            if (!result.valid) {
              this.$message.error(result.msg)
              return false
            } else {
              if (result.dup) {
                this.closeSingleEditAd()
                this.$message.success("素材，文案，cta组合没有变动，无需修改")
                return
              }
            }
            this.initErrAdTable([this.singleEditAdForm])
            let coverMap = {}
            this.editAcoCoverMap.forEach((val, key) => {
              coverMap[key] = val
            })
            let params = {
              creatives: this.singleEditAdForm.acoCreatives,
              adTextList: this.singleEditAdForm.acoAdTexts,
              callToAction: parseInt(this.singleEditAdForm.callToActionType) === '1' ? [] : this.singleEditAdForm.acoCTAs,
              callToActionType: this.singleEditAdForm.callToActionType,
              impressionTrackingUrl: this.singleEditAdForm.impressionTrackingUrl,
              clickTrackingUrl: this.singleEditAdForm.clickTrackingUrl,
              adGroupId: this.singleEditAdForm.adGroupId,
              platformId: this.singleEditAdForm.platformId,
              adIdentityName: this.singleEditAdForm.adIdentityName,
              identityId: this.editAdIdentityId,
              identityType: this.singleEditAdForm.identityType,
              adIds: this.singleEditAdForm.adIds,
              coverMap: coverMap,
            }
            editAcoDetail(params).then(res => {
              if (res.data.data.length > 0 && res.data.data[0].ttAdId !== "-1") {
                this.errAdTable = res.data.data
              }
            }).finally(() => {
              this.closeSingleEditAd()
              this.getAdTableData()
              this.errAdTableShow = true
            })
          } else {
            this.initErrAdTable([this.singleEditAdForm])
            let row = this.identityList.find(item => item.id === this.editAdIdentityId)
            if (row !== undefined) {
              this.singleEditAdForm.adIdentityName = row.displayName
              this.singleEditAdForm.identityType = row.identityType
              this.singleEditAdForm.identityId = row.identityId
            } else {
              this.$message.error("无效的身份信息!")
              return false
            }
            this.singleEditAdForm.creativeId = this.EditAdCreatives.id
            this.singleEditAdForm.updateCreative = this.singleEditAdForm.creativeId !== this.initAdCreativeId;
            this.singleEditAdLoading = true
            editAd(this.singleEditAdForm).then((res) => {
              if (res.data.data.length > 0 && res.data.data[0].ttAdId !== -1) {
                this.errAdTable = res.data.data
              }
            }).finally(() => {
              this.closeSingleEditAd()
              this.getAdTableData()
              this.errAdTableShow = true
            })
          }
        } else {
          this.$message.error("请检查参数是否有误")
          return false;
        }
      })
    },
    campaignNameEditEnable(row) {
      this.campaignNameEdit.newVal = row.campaignName;
      this.campaignNameEdit.editIndex = row.id;
      this.campaignNameEdit.editEnable = true;
    },
    changeCampaignName(row) {
      if (this.campaignNameEdit.newVal == '') {
        return;
      }
      if (row.campaignName == this.campaignNameEdit.newVal) {
        this.campaignNameEdit.editEnable = false;
        return;
      }
      this.$confirm('你确定要修改名称吗?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        //修改接口
        this.singleEditCampaignForm = _.cloneDeep(row)
        checkAdGroupExist(row.ttCampaignId).then((res) => {
          this.adGroupExist = res.data.data
        })
        this.singleEditCampaignForm.id = row.id
        this.singleEditCampaignForm.campaignName = this.campaignNameEdit.newVal
        this.submitSingleEditCamp()
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '放弃修改!'
        });
        this.campaignNameEdit.editEnable = false;
      });
    },
    closeSingleEditAd() {
      this.showEditAds = false
      this.isACO = false
      this.EditAdCreatives = {}
      this.singleEditAdForm = this.singleEditAdFormTemplate
      this.editAdIdentityId = ''
      this.initAdCreativeId = ''
      this.currentAccountId = ''
      this.landingPageList = []
      this.editIdentityListLoading = true
      this.singleEditAdLoading = false
      this.editAcoCoverMap = new Map()
    },
    async getCreativeById(creativeId) {
      const {data: res} = await selectone(creativeId)
      this.EditAdCreatives = res;
      if (!this.isACO) {
        const {data: r2} = await getAdCover(this.singleEditAdForm.id)
        this.EditAdCreatives.thumbnailUrl = r2.data
      }
    },
    async initLandingPageList() {
      await this.getEditLandingPageList()
    },
    async getEditLandingPageList() {
      if (this.landingPageLoading) return
      this.landingPageLoading = true
      const {data: res} = await getLandingPageList(this.currentAccountId).finally(() => {
        this.landingPageLoading = false
      })
      this.landingPageList = res.data
      if (this.singleEditAdForm.pageId !== "") {
        this.handleEditChangeLandingPage(this.singleEditAdForm.pageId)
      }
    },
    handleEditAds(row) {
      if (parseInt(row.status) === 1) {
        this.$message.warning("请选择创建成功且状态不为审核中的广告记录")
      } else {
        this.showEditAds = true
        let rowCopy = _.cloneDeep(row)
        this.isACO = rowCopy.creativeMaterialMode === 'DYNAMIC'
        if (this.isACO) {
          rowCopy.acoCreatives = []
          rowCopy.acoAdTexts = []
          rowCopy.acoCTAs = []
          rowCopy.adIds = []
          rowCopy.oldAcoCreatives = []
          rowCopy.oldAcoAdTexts = []
          rowCopy.oldAcoCTAs = []
          rowCopy.oldCoverMap = new Map()
          rowCopy.oldCTAType = _.cloneDeep(rowCopy.callToActionType)
          getAcoDetail({adGroupId: rowCopy.adGroupId}).then(res => {
            rowCopy.acoCreatives = res.data.data.creatives
            rowCopy.acoAdTexts = res.data.data.adTextList
            rowCopy.acoCTAs = res.data.data.callToAction
            rowCopy.oldAcoCreatives = _.cloneDeep(rowCopy.acoCreatives)
            rowCopy.oldAcoAdTexts = _.cloneDeep(rowCopy.acoAdTexts)
            rowCopy.oldAcoCTAs = _.cloneDeep(rowCopy.acoCTAs)
            rowCopy.adIds = res.data.data.adIds
            res.data.data.coverList.forEach(item => {
              rowCopy.oldCoverMap.set(item.creativeId, item.coverId)
            })
          })
        }
        this.singleEditAdForm = rowCopy
        if (this.singleEditAdForm.campaignAppProfilePageState === 'ON') {
          this.currentAccountId = this.singleEditAdForm.platformId
          this.initLandingPageList()
        }
        this.getEditIdentityList(false, this.singleEditAdForm.adGroupId, this.singleEditAdForm.appId)
        this.initAdCreativeId = this.singleEditAdForm.creativeId
        // this.editAdCallToActionType = this.singleEditAdForm.callToAction === '' ? 1 : 0
        this.getCreativeById(this.singleEditAdForm.creativeId)
        this.getCreativeTextList()
      }
    },
    initIdentityList() {
      let ides = this.singleEditAdForm.identityId
      this.identityList.forEach(ide => {
        if (ide.identityId === ides) {
          if (this.isACO) {
            this.editAdIdentityId = ide.identityId
          } else {
            this.editAdIdentityId = ide.id
          }
          this.$forceUpdate()
          return;
        }
      })
      this.editIdentityListLoading = false
    },
    handleCheckAllChange(event) {
      const all = this.defaultTableColumnData.map(item => {
        return item.value
      })
      if (event) {
        const dif = this.defaultTableColumnData.filter(item => !this.checkedBaseTarget.includes(item.value))
        this.tableHeaderOpt = [...this.tableHeaderOpt, ...dif]
        this.checkedBaseTarget = [...this.checkedBaseTarget, ...dif.map(item => item.value)]
      } else {
        this.tableHeaderOpt = this.tableHeaderOpt.filter(item => !all.includes(item.value))
        this.checkedBaseTarget = []
      }
      this.isIndeterminate = false
    },
    handleCheckAllChange1(event) {
      const all = this.defaultAppEventColumn.map(item => {
        return item.value
      })
      this.isIndeterminate1 = false
      if (event) {
        const dif = this.defaultAppEventColumn.filter(item => !this.checkAppEvent.includes(item.value))
        this.tableHeaderOpt = [...this.tableHeaderOpt, ...dif]
        this.checkAppEvent = [...this.checkAppEvent, ...dif.map(item => item.value)]
      } else {
        this.tableHeaderOpt = this.tableHeaderOpt.filter(item => !all.includes(item.value))
        this.checkAppEvent = []
      }
    },
    handleCheckAllChange2(event) {
      const all = this.defaultAttributionEventColumn.map(item => {
        return item.value
      })
      this.isIndeterminate2 = false
      if (event) {
        const dif = this.defaultAttributionEventColumn.filter(item => !this.checkAttributionEvent.includes(item.value))
        this.tableHeaderOpt = [...this.tableHeaderOpt, ...dif]
        this.checkAttributionEvent = [...this.checkAttributionEvent, ...dif.map(item => item.value)]
      } else {
        this.tableHeaderOpt = this.tableHeaderOpt.filter(item => !all.includes(item.value))
        this.checkAttributionEvent = []
      }
    },
    handleCheckAllChange3(event) {
      const all = this.defaultSettingColumn.map(item => {
        return item.value
      })
      this.isIndeterminate3 = false
      if (event) {
        const dif = this.defaultSettingColumn.filter(item => !this.checkSetting.includes(item.value))
        this.tableHeaderOpt = [...this.tableHeaderOpt, ...dif]
        this.checkSetting = [...this.checkSetting, ...dif.map(item => item.value)]
      } else {
        this.tableHeaderOpt = this.tableHeaderOpt.filter(item => !all.includes(item.value))
        this.checkSetting = []
      }
    },
    handleCheckedDimCol(event, val) {
      const checkedCount = this.checkedBaseTarget.length
      this.checkAll = checkedCount === this.defaultTableColumnData.length
      this.isIndeterminate = checkedCount > 0 && checkedCount < this.defaultTableColumnData.length
      if (event) {
        // 添加对象
        this.tableHeaderOpt.push(val)
      } else {
        // 删除对象
        this.tableHeaderOpt = _.remove(this.tableHeaderOpt, function (n) {
          // 数组中的对象
          return !_.isEqual(n, val) // 比较对象
        })
      }
    },
    //禁止拖动到id为1的对象
    onMove(e) {
      // console.log(e.relatedContext.element.value)
      const dis = this.defaultTableColumnData.filter(item => item.disabled).map(item => item.value)
      if (dis.includes(e.relatedContext.element.value)) return false;
      return true;
    },
    // 禁用的行
    isDisabled(value) {
      if (value === '00000000000' || value === '000000') {
        return true
      } else {
        return false
      }
    },
    // 移除已选择列
    removeCheckedCol(val) {
      this.tableHeaderOpt = _.remove(this.tableHeaderOpt, function (n) {
        // 数组中的对象
        return !_.isEqual(n, val) // 比较对象
      })
      this.checkedBaseTarget = _.remove(this.checkedBaseTarget, function (n) {
        // 数组中的对象
        return n !== val.value // 比较对象
      })
      this.checkAppEvent = _.remove(this.checkAppEvent, function (n) {
        // 数组中的对象
        return n !== val.value // 比较对象
      })
      this.checkAttributionEvent = _.remove(this.checkAttributionEvent, function (n) {
        // 数组中的对象
        return n !== val.value // 比较对象
      })
      this.checkSetting = _.remove(this.checkSetting, function (n) {
        // 数组中的对象
        return n !== val.value // 比较对象
      })
    },
    // 置顶已选择列
    upCheckedCol(val) {
      const dis = this.defaultTableColumnData.filter(item => item.disabled)
      this.tableHeaderOpt = _.remove(this.tableHeaderOpt, function (n) {
        // 数组中的对象
        return !_.isEqual(n, val) // 比较对象
      })
      this.tableHeaderOpt.splice(dis.length, 0, val)
      // this.tableHeaderOpt.unshift(val)
    },
    // 右边搜索栏
    rightSearchData() {
      if (this.headerQueryIntputRight) {
        return this.tableHeaderOpt.filter(item => {
          const input = this.headerQueryIntputRight.toLowerCase()
          const label = item.label.toLowerCase()
          return label.includes(input)
        })
      } else {
        return this.tableHeaderOpt
      }
    },
    createTableColumn() {
      if (this.campaignLoading || this.adGroupLoading || this.adLoading) return
      this.tableColumnData = _.cloneDeep(this.tableHeaderOpt)
      this.tableColumnDrawer = false
      this.sortMap = {}
      this.getDataByTab()
      // this.getCampaignTableData()
      // this.getAdGroupTableData()
      // this.getAdTableData()
      // this.page.current =1
      // this.onLoad()
    },
    changeDefualtTemplate() {
      this.tableHeaderOpt = [...this.defaultTableColumnData.filter(item => item.checked), ...this.defaultAttributionEventColumn.filter(item => item.checked), ...this.defaultAppEventColumn.filter(item => item.checked), ...this.defaultSettingColumn.filter(item => item.checked)]
      this.tableColumnData = [...this.tableHeaderOpt]
      this.checkedBaseTarget = [...this.defaultTableColumnData.filter(item => item.checked).map(item => item.value)]
      this.checkAppEvent = [...this.defaultAppEventColumn.filter(item => item.checked).map(item => item.value)]
      this.checkAttributionEvent = [...this.defaultAttributionEventColumn.filter(item => item.checked).map(item => item.value)]
      this.checkSetting = [...this.defaultSettingColumn.filter(item => item.checked).map(item => item.value)]
    },


    safeSplitCommon(str) {
      if (str === null || str === "" || str === undefined) {
        return []
      }
      return str.split(",")
    },
    safeCovertArrToString(arrs) {
      if (arrs instanceof Array && arrs.length > 0) {
        return arrs.join(",")
      }
      if (arrs instanceof String && arrs !== "") {
        return arrs
      }
      return ""
    },
    submitSingleEditADG() {
      this.$refs["editAdGroupForm"].$refs.adGroupForm.validate((valid) => {
        if (valid) {
          this.singleEditAdGroupFormLoading = true
          this.singleEditAdGroupButtonLoading = true
          let param = _.cloneDeep(this.$refs["editAdGroupForm"].adGroupForm)
          // let va = {
          //   "VIDEO_RELATED": this.singleEditAdGroupForm.videoUserAction.VIDEO_RELATED,
          //   "CREATOR_RELATED": this.singleEditAdGroupForm.videoUserAction.CREATOR_RELATED
          // }
          param.videoUserActions = JSON.stringify(param.videoUserActions)
          param.expansionTypes = this.safeCovertArrToString(param.expansionTypes)
          param.languages = this.safeCovertArrToString(param.languages)
          param.locationIds = this.safeCovertArrToString(param.locationIds)
          param.interestCategoryIds = this.safeCovertArrToString(param.interestCategoryIds)
          param.creatorRelatedCategoryIds = this.safeCovertArrToString(param.creatorRelatedCategoryIds)
          param.householdIncome = this.safeCovertArrToString(param.householdIncome)
          param.videoRelatedCategoryIds = this.safeCovertArrToString(param.videoRelatedCategoryIds)
          param.age = this.safeCovertArrToString(param.age)
          param.audienceIds = param.audienceIds.join(",")
          param.excludedAudienceIds = param.excludedAudienceIds.join(",")
          param.placement = this.safeCovertArrToString(param.placement)
          param.interestsByKeywordIds = param.interestsByKeywordIds.join(',')
          param.interestsByKeyword = JSON.stringify(param.interestsByKeyword)
          param.interestCategory = JSON.stringify(param.interestCategory)
          param.videoRelatedCategory = JSON.stringify(param.videoRelatedCategory)
          param.creatorRelatedCategory = JSON.stringify(param.creatorRelatedCategory)
          param.bidPrice = param.conversionBidPrice
          this.initErrAdGroupTable([param])
          editSingleAdGroup(param).then(res => {
            if (res.data.data.length > 0 && res.data.data[0].ttAdgroupId !== "-1") {
              this.errAdGroupTable = res.data.data
            }
          }).finally(() => {
            this.closeSingleEditSingleAdGroup()
            this.getAdGroupTableData()
            this.errAdGroupTableShow = true
          })
        } else {
          this.$message.error("参数错误，请确认好参数再提交")
          return false;
        }
      })

    },
    closeSingleEditSingleAdGroup() {
      this.singleEditAdGroupFormLoading = false
      this.singleEditAdGroupButtonLoading = false
      this.showEditSingleAdGroup = false
      this.clearCreateFromData()
    },
    handleEditSingleAdGroup(row) {
      console.log('编辑广告组', row)
      if (row.ttAdgroupId === '') {
        this.isSuccessAdGroup = false
      } else {
        this.isSuccessAdGroup = true
      }
      if (parseInt(row.status) === 1) {
        this.$message.warning("请选择创建成功且状态不为审核中的广告组记录")
        this.closeSingleEditSingleAdGroup()
      } else {
        let rowCopy = _.cloneDeep(row)
        rowCopy.audienceIds = this.safeSplitCommon(rowCopy.audienceIds)
        rowCopy.excludedAudienceIds = this.safeSplitCommon(rowCopy.excludedAudienceIds)
        this.adGroupForm = _.cloneDeep(rowCopy)
        this.showEditSingleAdGroup = true
      }
    },
    handleEditSingleCampaignBudgetSwitch(val) {
      if (val) {
        if (this.adGroupExist) {
          this.enableSwitchBudgetModeSgCamp = true
        }
        this.singleEditCampaignForm.budgetMode = "BUDGET_MODE_TOTAL"
        this.singleEditCampaignForm.budgetOptimizeSwitch = 0
        this.singleEditCampaignForm.budget = ''
      }
    },
    submitSingleEditCamp() {
      this.$refs["singleEditCampaignForm"].validate((valid) => {
        if (valid) {
          this.singleEditCampLoading = true
          this.initErrCampTable([this.singleEditCampaignForm])
          editSingleCampaign(this.singleEditCampaignForm).then((res) => {
            if (res.data.data.length > 0 && res.data.data[0].ttCampaignId !== "-1") {
              this.errCampTable = res.data.data
            }
          }).finally(() => {
            this.closeSingleEditCampaign()
            this.getCampaignTableData()
            this.errCampTableShow = true
          })
        } else {
          this.$message.error("请确认参数是否正确")
          return false;
        }
      })
    },
    closeSingleEditCampaign() {
      this.singleEditCampLoading = false
      this.adGroupExist = false
      this.enableSwitchBudgetModeSgCamp = false
      this.enableSwitchBudgetSingleCampaign = false
      this.showEditCampaign = false
      this.singleEditCampaignForm = this.singleEditCampaignFormTemplate
      this.selectedCampaigns = []
    },
    handleEditCampaign(row) {
      // console.log('编辑推广系列', row);
      if (row.ttCampaignId === '') {
        this.isSuccessCampaign = false
      } else {
        this.isSuccessCampaign = true
      }
      if (parseInt(row.status) === 1) {
        this.$message.warning("请选择创建成功且状态不为审核中的推广系列记录")
      } else {
        this.showEditCampaign = true
        // console.log('cp',row)
        this.singleEditCampaignForm = _.cloneDeep(row)
        this.singleEditCampaignForm.ios14Camppaign = row.campaignType === 'IOS14_CAMPAIGN'
        checkAdGroupExist(row.ttCampaignId).then((res) => {
          this.adGroupExist = res.data.data
        })
        if (row.budgetMode !== "" && row.budgetMode !== null && row.budgetMode !==
          "BUDGET_MODE_INFINITE") {
          this.singleEditCampaignForm.budgetSwitch = true
          this.enableSwitchBudgetModeSgCamp = true
          this.enableSwitchBudgetSingleCampaign = true
        }
        // console.log("campaign -> ", JSON.stringify(this.singleEditCampaignForm))
      }

    },
    getActiveAccountList() {
      getActiveAccountList(this.offerId).then((res) => {
        this.accountList2 = res.data.data
      });
    },
    refreshApp() {
      if (this.currentAccountId == '') {
        this.$message.warning("请先选择一个账号。");
        return;
      }
      this.appLoading = true;
      refreshAppList(this.currentAccountId, this.campaignForm.ios14Camppaign).finally((res) => {
        this.appLoading = false;
      });
    },
    // 选择账户
    accountChanged(val) {
      this.currentAccountId = val
      this.getLandingPageList()
      const cur = this.accountList.find(item => item.platformId === val)
      // 获取余额
      // this.accountBalance = cur.limits
      // 获取时区
      this.timezone = cur.timezoneOffset
      this.adGroupForm.scheduleStartTime = Moment().utc().add(this.timezone, "hours").format("yyyy-MM-DD HH:mm:ss")
      this.adGroupForm.scheduleEndTime = Moment().utc().add(this.timezone, "hours").add(14, "days").format("yyyy-MM-DD HH:mm:ss")

      // 获取受众
      this.getAudiencesList()
      // 获取发布身份
      this.campaignForm.platformAppId = cur.platformAppId
      this.getIdentityList()
      this.levelQuota = {
        campaignQuota: {
          availableQuota: '',
          releasingQuota: '',
          usedQuota: ''
        },
        adgroupQuota: {
          availableQuota: '',
          totalQuota: '',
          usedQuota: ''
        }
      }
      // 清除受众
      this.adGroupForm.audienceIds = []
      this.adGroupForm.excludedAudienceIds = []
    },
    // 获取app列表 （弃用）
    getAppList(accountId) {
      getAppList(accountId, this.campaignForm.ios14Camppaign).then((res) => {
        this.appList = res.data.data.map(item => {
          return {
            label: item.appName,
            value: item.platformAppId,
            os: item.os,
            impressionTrackingUrl: item.impressionTrackingUrl,
            clickTrackingUrl: item.clickTrackingUrl
          }
        });
      });
    },
    // 获取app列表
    async getAppList2(refresh) {
      this.levelQuota = {
        campaignQuota: {
          availableQuota: '',
          releasingQuota: '',
          usedQuota: ''
        },
        adgroupQuota: {
          availableQuota: '',
          totalQuota: '',
          usedQuota: ''
        }
      }
      this.appLoading = true
      const {data: res} = await getAccountAppList({offerId: this.offerId, refresh: refresh || false,}).finally(() => {
        this.appLoading = false
      })
      this.appList = res.data
    },
    // 获取余额
    async getAccountBalance() {
      this.balanceBtnLoading = true
      const {data: {data}} = await getTTAccountBalance(this.campaignForm.platformId).finally(() => {
        this.balanceBtnLoading = false
      })
      this.accountBalance = data
    },
    getData() {
      this.getTiktokInterestTree()
      this.getCreatorRelatedTree()
      this.getVideoRelatedTree()
      this.getCreativeTextList()
      this.getActiveAccountList()
      this.getAppList2()
      this.getDataByTab()
      getAllUser({statusList: '0,1,2', isAll: true}).then((res) => {
        this.designersList = res.data.data;
      });
    },
    // 筛选组件事件
    handleChangeFilter(val) {
      this.queryFilterInfo = val
      // console.log(this.queryFilterInfo)
      this.getDataByTab()
    },
    // 根据标签页查数据
    getDataByTab() {
      switch (this.activeName) {
        case 'campaign':
          this.campaignPage.current = 1
          this.getCampaignTableData()
          break
        case 'adGroup':
          this.adGroupPage.current = 1
          this.getAdGroupTableData()
          break
        case 'ad':
          this.adPage.current = 1
          this.getAdTableData()
          break
      }
    },
    // campaign全选
    handleCampaignSelectionChange(val) {
      this.selectedCampaigns = val
      // this.adGroupTableData=val
      this.queryFilterInfo = {campaignIds: val.map(item => item.id).join(',')}

    },
    // ad group全选
    handleAdGroupSelectionChange(val) {
      this.selectedAdGroups = val
      this.queryFilterInfo = {adGroupIds: val.map(item => item.id).join(',')}

    },
    handleAdSelectionChange(val) {
      this.selectedAds = val
    },
    iHeaderCellStyle() {
      return {
        color: '#101010',
        backgroundColor: '#F2F2F2'
      }
    },
    iRowStyle({row, rowIndex}) {
      return {
        height: '80px',
      }
    },
    // 推广系列预算优化
    handleBudgetOptimizeSwitch(val) {
      if (val === 1) {
        this.campaignForm.budgetSwitch = false
      }
    },
    // 设置广告广系列预算按钮
    handleBudgetSwitch(val) {
      if (val) {
        this.campaignForm.budgetOptimizeSwitch = 0
        this.campaignForm.budgetMode = 'BUDGET_MODE_DAY'
      } else {
        this.campaignForm.budget = ''
        this.campaignForm.budgetMode = ''
      }
    },
    // 返回到列表
    backToIndex() {
      this.pageType = 1
      this.campaignStep = ''
      this.selectedCampaigns = []
      this.selectedAds = []
      this.selectedAdGroups = []
    },

    selectAll(val, e) {
      const all = this.locationList.map(item => {
        return item.value
      })
      console.log(e)
      if (e) {
        val.push(...all)
      } else {
        val.splice(0, val.length)
      }
      this.createRenderAdGroup()
      this.checkOptions.isIndeterminate = false
    },
    // 处理创建广告组
    createRenderAdGroup() {
      if (this.adGroupForm.batch) { // 批量创建
        if (this.adGroupForm.autoCreateType === 1) { // 对应
          this.renderAdGroupList = this.adGroupForm.groupList.map((item, index) => {
            item.adgroupName = this.adGroupForm.adgroupName + "-" + (index + 1)
            return item
          })
        } else { // 组合
          let step = 1
          this.renderAdGroupList = []
          this.adGroupForm.locationIdsArr.forEach((locationIds, i1) => {
              this.adGroupForm.languagesArr.forEach((languages, i2) => {
                this.adGroupForm.genderArr.forEach((gender, i3) => {
                  this.adGroupForm.ageArr.forEach((age, i4) => {
                    this.renderAdGroupList.push({
                      adgroupName: this.adGroupForm.adgroupName + '-' + (step++),
                      locationIds: locationIds,
                      languages: languages,
                      gender: gender,
                      age: age
                    })
                  })
                })
              })
            }
          )
        }
      } else { // 单个广告组
        if (this.renderAdGroupList.length !== 1) {
          this.renderAdGroupList = [{
            adgroupName: '',
            locationIds: [],
            languages: [],
            gender: '',
            age: ''
          }]
        }
        this.renderAdGroupList[0].adgroupName = this.adGroupForm.adgroupName
        this.renderAdGroupList[0].locationIds = this.adGroupForm.locationIds
        this.renderAdGroupList[0].languages = this.adGroupForm.languages
        this.renderAdGroupList[0].gender = this.adGroupForm.gender
        this.renderAdGroupList[0].age = this.adGroupForm.age
      }
    },
    // 删除广告组
    removeAdGroup(index) {
      if (this.adGroupForm.batch) { // 批量创建
        if (this.adGroupForm.autoCreateType === 1) { // 对应
          this.adGroupForm.groupList.splice(index, 1)
          this.renderAdGroupList.splice(index, 1)
        } else { // 组合
          this.renderAdGroupList.splice(index, 1)
        }
      } else { // 单个广告组
      }
    },
    // 筛选地区回显
    filterLocation(locationIds) {
      if (this.locationList.length == 0)
        return ''
      if (locationIds.length > 0) {
        return locationIds.reduce((prev, cur, index, arr) => {
          return prev + this.locationList.find(item => item.value === cur).label.toString() + (arr.length - 1 === index ? '' : '，')
        }, '')
      } else {
        return ''
      }
    },
    // 筛选语言回显
    filterLanguages(languages) {
      if (languages.length > 0) {
        return languages.reduce((prev, cur, index, arr) => {
          return prev + this.languagesList.find(item => item.value === cur).label.toString() + (arr.length - 1 === index ? '' : '，')
        }, '')
      } else {
        return ''
      }
    },
    // 筛选性别回显
    filterGender(gender) {
      if (gender) {
        return this.genderList.find(item => item.value === gender).label
      } else {
        return ''
      }
    },
    // 筛选年龄回显
    filterAge(origin) {
      const age = _.compact(origin)
      if (age.length > 0) {
        return age.reduce((prev, cur, index, arr) => {
          return prev + this.ageGroupsList.find(item => item.value === cur).label.toString() + (arr.length - 1 === index ? '' : '，')
        }, '')
      } else {
        return ''
      }
    },
    nextStep(index) {
    },
    // 新建推广系列
    createCampaign() {
      this.curEditAdgroup = 0
      this.clearCreateFromData()
      this.currentTaskId = null
      this.accountBalance = '0.0'
      this.disabledCreativeMaterialMode = false
      this.disabledAppSelect = false
      this.pageType = 2
      this.campaignStep = 1
      this.opeType = 1
      this.checkOptions.checkAll = false
    },
    // 新建广告组
    async createAdGroup() {
      this.copyAdGroupFormIsAdd = true
      this.disabledCreativeMaterialMode = false
      this.getCampaignList()
      this.clearCreateFromData()
      this.copyAdGroupForm = {
        num: 1,
        isCreateCampaign: false,
        campaignName: '',
        campaignId: '',
        clone: {
          campaignId: ''
        }
      }
      if (this.selectedCampaigns.length > 0) {
        this.copyAdGroupForm.campaignId = this.selectedCampaigns[0].id
      }
      this.copyAdGroupDialog = true
      this.checkOptions.checkAll = false
    },
    // 新建广告
    createAdv() {
      this.copyAdFormIsAdd = true
      this.disabledCreativeMaterialMode = false
      this.getCampaignList()
      this.clearCreateFromData()
      this.copyAdForm = {
        num: 1,
        isCreateCampaign: false,
        campaignId: '',
        isCreateAdGroup: false,
        campaignName: '',
        adGroupId: '',
        adGroupName: '',
        clone: {
          campaignId: ''
        }
      }
      this.copyAdDialog = true
    },
    // 导航
    selectMenu(index) {
      const cur = index.split('-')[0] - 0
      if (this.campaignStep == 1) {
        if (cur === 2) {
          // console.log(this.$refs.campaignForm)
          this.$refs.campaignForm.validate(valid => {
              if (!valid) return
              this.campaignStep = cur
              this.$nextTick(() => {
                this.$refs[index].$el.scrollIntoView(false)
              })
            }
          )
        } else if (cur === 3) {
          this.$refs.campaignForm.validate(valid => {
              if (!valid) return
              this.campaignStep = 2
              this.$nextTick(() => {
                this.$refs.adGroupForm.validate(valid => {
                  if (!valid) return
                  this.campaignStep = cur
                  this.$nextTick(() => {
                    this.$refs[index].$el.scrollIntoView(false)
                  })
                })
              })
            }
          )
        } else {
          this.$nextTick(() => {
            this.$refs[index].$el.scrollIntoView(false)
          })
        }
      } else if (this.campaignStep == 2) {
        if (cur === 3) {
          this.$refs.adGroupForm.validate(valid => {
              if (!valid) return
              this.campaignStep = cur
              this.$nextTick(() => {
                this.$refs[index].$el.scrollIntoView(false)
              })
            }
          )
        } else {
          this.campaignStep = cur
          this.$nextTick(() => {
            this.$refs[index].$el.scrollIntoView(false)
          })
        }
      } else {
        this.campaignStep = cur
        this.$nextTick(() => {
          this.$refs[index].$el.scrollIntoView(false)
        })
      }
    },
    // 获取素材数据
    async getCreativeTabelData() {
      this.creativeLoading = true
      if (this.adGroupForm.placementType === 'PLACEMENT_TYPE_NORMAL' && this.adGroupForm.placement[0] === 'PLACEMENT_TIKTOK') {
        this.creativeQueryForm.type = 1
      }
      const creativeQueryForm = _.cloneDeep(this.creativeQueryForm)
      creativeQueryForm.strStatus = creativeQueryForm.strStatus.join(',')
      delete creativeQueryForm.date
      const {data: res} = await offerCreativePage(
        {
          offerId: this.offerId,
          platform: 'tiktok',
          ...this.creativePage,
          ...creativeQueryForm
        }
      ).finally(() => {
        this.creativeLoading = false
      })
      this.creativeTableData = res.data.records
      this.creativeTotal = res.data.total
    },
    clearCreativeQuery() {
      this.creativeQueryForm = {
        shortId: '',
        localFilename: '',
        name: '',
        type: '',
        date: '',
        beginDate: null,
        endDate: null,
        sizeType: '',
        requestName: '',
        strStatus: [1, 2],
        designer: '',
        beginAuditDate: '',
      }
      this.getCreativeTabelData()
    },
    // 显示素材抽屉
    showCreativeDrawer() {
      this.uploadFromStroeDrawer = true
      this.getCreativeTabelData()
    },
    handleCreativeSelectionChange(val) {
      this.multipleCreativeSelection = val
    },
    // 格式化素材类型
    formatterCreativeType(row, column, cellValue, index) {
      if (cellValue == 0) {
        return '图片'
      } else {
        return '视频'
      }
    },
    handleCreativeSizeChange(val) {
      this.creativePage.size = val
      this.creativePage.current = 1
      this.getCreativeTabelData()
    },
    handleCreativeCurrentChange(val) {
      this.creativePage.current = val
      this.getCreativeTabelData()
    },
    handleEditCreativeSizeChange(val) {
      this.creativePage.size = val
      this.creativePage.current = 1
      this.getCreativeEditTableData()
    },
    handleEditCreativeCurrentChange(val) {
      this.creativePage.current = val
      this.getCreativeEditTableData()
    },
    // 确定选中的素材
    submitCreative() {
      if (this.adForm.batch) {
        const arr = this.adForm.adList[this.curEditAdgroup].creativeList.concat(
          this.multipleCreativeSelection.map(item => {
            item.words = [''] // 加入文案字段
            return item
          }))
        let newArr = arr.reduce((pre, cur) => {
          if (!pre.some(item => item.shortId == cur.shortId)) {
            return pre.concat(cur)
          } else {
            return pre
          }
        }, [])
        if (this.adGroupForm.creativeMaterialMode === 'DYNAMIC' && newArr.length > 30)
          return this.$message.warning('程序化创意素材不能超过30个')
        this.adForm.adList[this.curEditAdgroup].creativeList = newArr
      } else { // 单个处理
        const temp = this.multipleCreativeSelection[0]
        temp.words = ['']
        this.adForm.adList[this.curEditAdgroup].creativeList = [temp]
      }
      this.createRenderAdList()
      this.uploadFromStroeDrawer = false
    },
    // 处理创建广告
    createRenderAdList() {
      let renderIndex = 0
      if (this.adForm.batch) {
        if (this.adForm.adList[this.curEditAdgroup].autoCreateType === 1) { // 对应
          this.renderAdList[this.curEditAdgroup] = []
          let step = 1
          this.adForm.adList[this.curEditAdgroup].creativeList.forEach((creative, i1) => {
            creative.words.forEach((word, i2) => {
              this.renderAdList[this.curEditAdgroup].push({
                campaignAppProfilePageState: this.campaignForm.campaignAppProfilePageState,
                imageUrl: this.adForm.adList[this.curEditAdgroup].imageUrl,
                landingPageUrl: this.adForm.adList[this.curEditAdgroup].landingPageUrl,
                pageId: this.adForm.adList[this.curEditAdgroup].pageId,
                adName: creative.name + '-' + (step++),
                creative,
                word: word.trim(),
                adIdentityId: this.adForm.adList[this.curEditAdgroup].adIdentityId,
                callToAction: this.adForm.adList[this.curEditAdgroup].callToAction,
                callToActionType: this.adForm.adList[this.curEditAdgroup].callToActionType,
                tableIndex: this.curEditAdgroup + "_" + renderIndex,
              })
              renderIndex += 1
            })
          })
        } else {// 组合
          this.renderAdList[this.curEditAdgroup] = []
          let step = 1
          if (this.adGroupForm.creativeMaterialMode === 'DYNAMIC'
            && this.adForm.adList[this.curEditAdgroup].callToActionType === '0') { // 程序化创意
            this.adForm.adList[this.curEditAdgroup].callToActionArr.forEach(call => {
              this.adForm.adList[this.curEditAdgroup].creativeList.forEach((creative, i1) => {
                this.adForm.adList[this.curEditAdgroup].words.forEach((word, i2) => {
                  this.renderAdList[this.curEditAdgroup].push({
                    campaignAppProfilePageState: this.campaignForm.campaignAppProfilePageState,
                    imageUrl: this.adForm.adList[this.curEditAdgroup].imageUrl,
                    landingPageUrl: this.adForm.adList[this.curEditAdgroup].landingPageUrl,
                    pageId: this.adForm.adList[this.curEditAdgroup].pageId,
                    adName: creative.name + '-' + (step++),
                    creative,
                    word: word.trim(),
                    adIdentityId: this.adForm.adList[this.curEditAdgroup].adIdentityId,
                    callToAction: call,
                    callToActionType: this.adForm.adList[this.curEditAdgroup].callToActionType,
                    tableIndex: this.curEditAdgroup + "_" + renderIndex,
                  })
                  renderIndex += 1
                })
              })
            })
          } else {
            this.adForm.adList[this.curEditAdgroup].creativeList.forEach((creative, i1) => {
              this.adForm.adList[this.curEditAdgroup].words.forEach((word, i2) => {
                this.renderAdList[this.curEditAdgroup].push({
                  campaignAppProfilePageState: this.campaignForm.campaignAppProfilePageState,
                  imageUrl: this.adForm.adList[this.curEditAdgroup].imageUrl,
                  landingPageUrl: this.adForm.adList[this.curEditAdgroup].landingPageUrl,
                  pageId: this.adForm.adList[this.curEditAdgroup].pageId,
                  adName: creative.name + '-' + (step++),
                  creative,
                  word: word.trim(),
                  adIdentityId: this.adForm.adList[this.curEditAdgroup].adIdentityId,
                  callToAction: this.adForm.adList[this.curEditAdgroup].callToAction,
                  callToActionType: this.adForm.adList[this.curEditAdgroup].callToActionType,
                  tableIndex: this.curEditAdgroup + "_" + renderIndex,
                })
                renderIndex += 1
              })
            })
          }
        }
      } else { // 单个处理
        this.renderAdList[this.curEditAdgroup] = [{
          creative: this.adForm.adList[this.curEditAdgroup].creativeList[0] ?
            this.adForm.adList[this.curEditAdgroup].creativeList[0] : null,
          word: this.adForm.adList[this.curEditAdgroup].word.trim(),
          adName: this.adForm.adList[this.curEditAdgroup].creativeList[0].name,
          adIdentityId: this.adForm.adList[this.curEditAdgroup].adIdentityId,
          campaignAppProfilePageState: this.campaignForm.campaignAppProfilePageState,
          imageUrl: this.adForm.adList[this.curEditAdgroup].imageUrl,
          landingPageUrl: this.adForm.adList[this.curEditAdgroup].landingPageUrl,
          pageId: this.adForm.adList[this.curEditAdgroup].pageId,
          tableIndex: this.curEditAdgroup + "_" + renderIndex,
        }]
      }
      if (this.adGroupForm.creativeMaterialMode === 'CUSTOM' && this.renderAdList[this.curEditAdgroup].length > 20)
        this.$message.warning('广告个数已超过广告组限额，请重新调整广告，不超过20个。')
    },
    // 删除创建广告
    removeRenderAdList(index) {
      if (this.adForm.batch) {
        // if (this.adForm.autoCreateType === 1) { // 对应
        //
        // } else {// 组合
        //
        // }
        this.renderAdList[this.curEditAdgroup].splice(index, 1)
      } else { // 单个处理
      }
    },
    // 创建预览表格
    createFinallyTableData() {
      if (!this.campaignForm.sameCreativesForAdgroup) {
        for (let i = 0; i < this.adForm.adList.length; i++) {
          if (this.adForm.adList[i].creativeList.length == 0) {
            this.$message.warning('您还没有给以下广告组配置素材：' + this.adForm.adList[i].adGroup)
            return
          }
          if (this.adForm.adList[i].autoCreateType == 2 && this.adForm.adList[i].words.length == 0) {
            this.$message.warning('您还没有给以下广告组配置文案：' + this.adForm.adList[i].adGroup)
            return
          }
        }
      }

      this.saveDraft()
      this.$refs.adFrom.validate((valid, err) => {
        if (valid) {
          const check = this.checkAdPage()
          if (check) {
            this.pageType = 3
            this.finallyTableData = []
            if (this.campaignForm.sameCreativesForAdgroup) {
              this.renderAdList[0].forEach(ad => {
                ad.adIdentityId = this.adForm.adList[0].adIdentityId
                ad.pageId = this.adForm.adList[0].pageId
                ad.landingPageUrl = this.adForm.adList[0].landingPageUrl
                ad.imageUrl = this.adForm.adList[0].imageUrl
              })
              for (let i = 0; i < this.renderAdGroupList.length; i++) {
                this.renderAdList[0].forEach(adv => {
                  this.finallyTableData.push({
                    ...this.renderAdGroupList[i],
                    ...adv
                  })
                })
              }
            } else {
              for (let i = 0; i < this.renderAdGroupList.length; i++) {
                this.renderAdList[i].forEach(adv => {
                  adv.adIdentityId = this.adForm.adList[i].adIdentityId
                  this.finallyTableData.push({
                    ...this.renderAdGroupList[i],
                    ...adv
                  })
                })
              }
            }

            this.$nextTick(() => {
              this.$refs.finallyTable.toggleAllSelection()
            })
          }
        } else {
          Object.keys(err).forEach((key, i) => {
            const propName = err[key][0].field
            if (i === 0) {
              this.$refs['ad-' + propName].$el.scrollIntoView({
                block: 'end',
                behavior: 'smooth'
              })
            }
          })
        }
      })

    },
    // 合并表格
    objectSpanMethod({row, column, rowIndex, columnIndex}) {
      const same = this.finallyTableData.filter(item => item.adgroupName === row.adgroupName)
      if (same.length >= 2) {
        const key = Math.random() // 前端标识
        same.forEach((item, index) => {
          if (!item.hasOwnProperty('key')) {
            item.key = key
          }
          if (!item.hasOwnProperty('row')) {
            if (index === 0) {
              item.row = same.length
            } else {
              item.row = 0
            }
          }
        })
      }
      if (columnIndex >= 0 && columnIndex < 5) {
        if (row.hasOwnProperty('row')) {
          return {
            rowspan: row.row,
            colspan: 1
          }
        }
      }
    },
    handleFinallyTableSelectionChange(val) {
      this.finallyTableMultipleSelection = val;
    },
    // 发布并暂停campaign
    async submitCreateCampaign() {
      if (this.submitCampaignLoading) return
      this.adForm.adList.forEach(item => {
        if (item.pageId == '' && item.landingPageUrl == '') {
          item.pageId = this.adForm.adList[0].pageId
          item.landingPageUrl = this.adForm.adList[0].landingPageUrl
        }
      })
      const actionScene = []
      if (this.adGroupForm.videoUserAction.VIDEO_RELATED.length) {
        actionScene.push('VIDEO_RELATED')
      }
      if (this.adGroupForm.videoUserAction.CREATOR_RELATED.length) {
        actionScene.push('CREATOR_RELATED')
      }
      const adGroups = this.finallyTableMultipleSelection.reduce((total, cur) => {
        if (cur.row !== 0) {
          // 广告组层级
          return total.concat({
            "adgroupName": cur.adgroupName,
            "age": cur.age.join(','),
            "gender": cur.gender,
            "languages": cur.languages.join(','),
            "locationIds": cur.locationIds.join(','),
            "appId": this.campaignForm.appId,
            "autoTargetingEnabled": this.adGroupForm.autoTargetingEnabled,
            "bidPrice": this.adGroupForm.bidPrice,
            "bidType": this.adGroupForm.bidType,
            "budget": this.adGroupForm.budget,
            "budgetMode": this.adGroupForm.budgetMode,
            "commentDisabled": this.adGroupForm.commentDisabled,
            "householdIncome": this.adGroupForm.householdIncome.join(','),
            "optimizationEvent": this.adGroupForm.optimizationEvent,
            "optimizationGoal": this.adGroupForm.optimizationGoal,
            "pacing": this.adGroupForm.pacing,
            "placementType": this.adGroupForm.placementType,
            "scheduleStartTime": this.adGroupForm.scheduleStartTime,
            "scheduleEndTime": this.adGroupForm.scheduleEndTime,
            "scheduleType": this.adGroupForm.scheduleType,
            "videoDownloadDisabled": this.adGroupForm.videoDownloadDisabled,
            "blockedPangleDisabled": this.adGroupForm.blockedPangleDisabled,
            "placement": this.adGroupForm.placement.join(','),
            "interestCategoryIds": this.adGroupForm.interestCategoryIds.join(','),
            "interestCategory": JSON.stringify(this.adGroupForm.interestCategory),
            "operationStatus": "DISABLE",
            "platformId": this.campaignForm.platformId,
            "billingEvent": this.adGroupForm.optimizationGoal === "CLICK" ? 'CPC' : 'OCPM',
            "conversionBidPrice": this.adGroupForm.conversionBidPrice,
            "dailyRetentionRatio": this.adGroupForm.dailyRetentionRatio,
            "os": this.campaignForm.os,
            "deepBidType": this.adGroupForm.deepBidType,
            "roasBid": this.adGroupForm.roasBid,
            "audienceIds": this.adGroupForm.audienceIds.join(','),
            "excludedAudienceIds": this.adGroupForm.excludedAudienceIds.join(','),
            "expansionEnabled": this.adGroupForm.expansionTypes.length > 0 ? 1 : 0,
            "expansionTypes": this.adGroupForm.expansionTypes.join(','),
            "videoUserActions": JSON.stringify(this.adGroupForm.videoUserAction),
            "actionPeriod": this.adGroupForm.videoRelatedCategoryIds.length === 0 ? '' : this.adGroupForm.actionPeriod,
            "creatorRelatedCategoryIds": this.adGroupForm.creatorRelatedCategoryIds.join(','),
            "creatorRelatedCategory": JSON.stringify(this.adGroupForm.creatorRelatedCategory),
            "actionScene": actionScene.join(','),
            "videoRelatedCategoryIds": this.adGroupForm.videoRelatedCategoryIds.join(','),
            "videoRelatedCategory": JSON.stringify(this.adGroupForm.videoRelatedCategory),
            "creativeMaterialMode": this.adGroupForm.creativeMaterialMode,
            "interestsByKeyword": JSON.stringify(this.adGroupForm.interestsByKeyword),
            "interestsByKeywordIds": this.adGroupForm.interestsByKeywordIds.join(','),
            "shareDisabled": this.adGroupForm.shareDisabled,
            key: cur.key // 前端标识
          })
        } else {
          return total
        }
      }, [])
      adGroups.forEach((item, index) => {
        item.ttAdList = this.finallyTableMultipleSelection.filter(item1 => {
          if (item1.key !== undefined) {
            return item1.key === item.key
          } else {
            return item1.adgroupName === item.adgroupName
          }
        }).map(item2 => {
          let coverId = this.adForm.coverMap[item2.creative.id]
          console.log("cover id -> ", coverId)
          // 广告层级
          return {
            "adName": item2.adName,
            "adText": item2.word,
            "adFormat": item2.creative.type == 0 ? 'SINGLE_IMAGE' : 'SINGLE_VIDEO',
            "callToActionType": this.adForm.adList[index].callToActionType,
            "callToAction": this.adForm.adList[index].callToActionType == '0' ? item2.callToAction : '',
            "clickTrackingUrl": this.adForm.clickTrackingUrl,
            "creativeId": item2.creative.id,
            "impressionTrackingUrl": this.adForm.impressionTrackingUrl,
            "operationStatus": "DISABLE",
            "identityType": "CUSTOMIZED_USER",
            "identityId": item2.adIdentityId,
            "adIdentityName": this.adForm.adList[index].adIdentityName,
            "proportion": item2.creative.proportion,
            "creativeType": item2.creative.type,
            "landingPageUrl": this.adForm.adList[index].landingPageUrl,
            "pageId": this.adForm.adList[index].pageId,
            "imageUrl": this.adForm.adList[index].imageUrl,
            "coverId": coverId === undefined ? null : coverId,
          }
        })
      })
      const campaign = {
        "budget": this.campaignForm.budget,
        "budgetMode": this.campaignForm.budgetMode,
        "budgetOptimizeSwitch": this.campaignForm.budgetOptimizeSwitch,
        "campaignName": this.campaignForm.campaignName,
        "campaignType": this.campaignForm.ios14Camppaign ? 'IOS14_CAMPAIGN' : this.campaignForm.campaignType,
        "objectiveType": this.campaignForm.objectiveType,
        "operationStatus": "DISABLE",
        "platformId": this.campaignForm.platformId,
        "offerId": this.offerId,
        "appName": this.campaignForm.appName,
        "appId": this.campaignForm.appId,
        "os": this.campaignForm.os,
        "campaignManagementId": this.currentTaskId,
        "sameCreativesForAdgroup": this.campaignForm.sameCreativesForAdgroup,
        "campaignAppProfilePageState": this.campaignForm.ios14Camppaign ? this.campaignForm.campaignAppProfilePageState : ''
      }
      if (this.opeType === 1 || this.opeType === 2) {
        if (adGroups.some(item => item.ttAdList.length > 20 && item.creativeMaterialMode === 'CUSTOM')) return this.$message.error('每个广告组最多只能创建20条广告')
        this.submitCampaignLoading = true
        await createAdCampaign({
          campaign,
          adGroups,
          sourceData: JSON.stringify({
            campaignForm: this.campaignForm,
            adGroupForm: this.adGroupForm,
            adForm: this.adForm
          }),
        }).finally(() => {
          this.submitCampaignLoading = false
        })
      } else if (this.opeType === 3) {
        this.submitCampaignLoading = true
        await createBatchAdGroup(this.copyAdGroupForm.campaignId,
          adGroups
        ).finally(() => {
          this.submitCampaignLoading = false
        })
        console.log(adGroups)
      } else if (this.opeType === 4) {
        this.submitCampaignLoading = true
        await createBatchAd(this.copyAdForm.adGroupId,
          adGroups[0].ttAdList).finally(() => {
          this.submitCampaignLoading = false
        })
      }
      this.pageType = 1
      this.campaignStep = ''
      this.clearCreateFromData()
      this.$message.success('提交成功')
      this.selectedCampaigns = []
      this.selectedAdGroups = []
      this.selectedAds = []
      this.getDataByTab()
    },
    // 获取兴趣列表
    async getTiktokInterestTree(refresh) {
      this.interestBtnLoading = true
      const {data: res} = await getTiktokInterestTree({
        refresh: refresh || false
      }).finally(() => {
        this.interestBtnLoading = false
      })
      // console.log(res)
      this.tiktokInterestTree = res.data
      this.tiktokInterestList = []
      this.transformList(res.data, this.tiktokInterestList)
    },
    // 清除兴趣
    clearSelectTree(value, ref) {
      value = []
      ref.setCheckedKeys([])
    },
    // 移除兴趣多选框中tag
    removeSelectTreeTag(tag, ref) {
      ref.setChecked(tag, false)
    },
    // // 兴趣选择
    // handleInterestNodeClick(data, self, child) {
    //   let datalist = this.$refs.tiktokInterestTree.getCheckedNodes(true)
    //   this.adGroupForm.interestCategoryIds = datalist.map(item => item.value)
    // },
    // 兴趣选择
    handleInterestNodeClick(data, self, child) {
      this.adGroupForm.interestCategoryIds = this.$refs.tiktokInterestTreeC.getCheckedNodes(true).map(item => item.value)
    },
    changeInterestKeyword(val) {
      if (this.interestByKeywordTimer !== null)
        clearTimeout(this.interestByKeywordTimer)
      this.interestByKeywordTimer = setTimeout(() => {
      }, 500)
    },
    // 把属性结构结果转换成数组
    transformList(tree, res) {
      tree.forEach(item => {
        if (item.hasOwnProperty('children')) {
          this.transformList(item.children, res)
        } else {
          res.push({
            label: item.label,
            value: item.value
          })
        }
      })
    },
    // 添加行为:视频互动
    async getCreatorRelatedTree(refresh) {
      const {data: res} = await getActionCategories({
        refresh: refresh || false,
        type: 'CREATOR_RELATED'
      })
      this.creatorRelatedTree = res.data
      this.creatorRelatedList = []
      this.transformList(res.data, this.creatorRelatedList)
    },
    // 添加行为:创作者互动
    async getVideoRelatedTree(refresh) {
      const {data: res} = await getActionCategories({
        refresh: refresh || false,
        type: 'VIDEO_RELATED'
      })
      this.videoRelatedTree = res.data
      this.videoRelatedList = []
      this.transformList(res.data, this.videoRelatedList)
    },
    // 文案库
    async getCreativeTextList() {
      getTextList(this.offerId).then(res => {
        this.searchTextData = this.textData = res.data.data;
        this.textData.forEach(item => {
          this.creativeTexts.push(item.text)
        })
      });
    },
    handleChangeVideoRelated() {
      if (this.adGroupForm.videoUserAction.VIDEO_RELATED.length === 0 && this.adGroupForm.videoRelatedCategory.length === 0) {
        this.$refs.adGroupForm.clearValidate('videoRelatedCategoryIds')
        this.$refs.adGroupForm.clearValidate('videoUserAction.VIDEO_RELATED')
      }
    },
    // 行为视频互动点击
    handleVideoNodeClick() {
      if (this.adGroupForm.videoUserAction.VIDEO_RELATED.length === 0 && this.adGroupForm.videoRelatedCategory.length === 0) {
        this.$refs.adGroupForm.clearValidate('videoRelatedCategoryIds')
        this.$refs.adGroupForm.clearValidate('videoUserAction.VIDEO_RELATED')
      }
      this.adGroupForm.videoRelatedCategoryIds = this.$refs.videoRelatedTreeC.getCheckedNodes(true).map(item => item.value)
    },
    // 行为 作者
    handleCreatorNodeClick() {
      this.adGroupForm.creatorRelatedCategoryIds = this.$refs.creatorRelatedTreeC.getCheckedNodes(true).map(item => item.value)
    },
    // 获取受众列表
    async getAudiencesList(refresh) {
      this.audiencesBtnLoading = true
      const {data: res} = await getAudiencesInfo(
        {
          refresh: refresh || false,
          platformId: this.campaignForm.platformId,
          // platformId: '7068120188243197954',
        }
      ).finally(() => {
        this.audiencesBtnLoading = false
      })
      this.audiencesRes = res.data
      this.audiencesList = [{name: '自定义受众', audienceId: -1, children: []}, {name: '类似受众', audienceId: -2, children: []}]
      this.audiencesList[0].children = res.data.filter(item => item.type === 0)
      this.audiencesList[1].children = res.data.filter(item => item.type === 1)
      this.excludedAudiencesList = _.cloneDeep(this.audiencesList)
    },
    // 选择qpp获取os
    async handleChangeApp(val) {
      await this.getAccountListByAppId()
      const cur = this.appList.find(item => item.platformAppId === val)
      this.adForm.impressionTrackingUrl = cur.impressionTrackingUrl
      this.adForm.clickTrackingUrl = cur.clickTrackingUrl
      this.campaignForm.os = cur.os
      this.campaignForm.appName = cur.appName
      this.adForm.adList.forEach(item => {
        item.adIdentityName = this.campaignForm.appName
      })
      // this.adForm.adList[this.curEditAdgroup].adIdentityName = this.campaignForm.appName
      this.campaignForm.ios14Camppaign = false
      this.campaignForm.platformId = ''
      // 清空优化目标
      this.adGroupForm.optimizationGoal = 'INSTALL'
      this.adGroupForm.optimizationEvent = ''
      // 头像赋值
      this.logoUrl = cur.logoUrl
    },
    // 选择qpp获取os
    async handleChangeAppByCopy(val) {
      await this.getAccountListByAppId()
      const cur = this.appList.find(item => item.platformAppId === val)
      this.adForm.impressionTrackingUrl = cur.impressionTrackingUrl
      this.adForm.clickTrackingUrl = cur.clickTrackingUrl
      this.campaignForm.os = cur.os
      this.campaignForm.appName = cur.appName
      this.adForm.adList.forEach(item => {
        item.adIdentityName = this.campaignForm.appName
      })
      // 头像赋值
      this.logoUrl = cur.logoUrl
    },
    async getAccountListByAppId() {
      this.selectAccountLoading = true
      const {data: res} = await getAccountListByAppId({
        offerId: this.offerId,
        platformAppId: this.campaignForm.appId
      }).finally(() => {
        this.selectAccountLoading = false
      })
      // this.$set(this,'accountList',res.data)
      this.accountList = res.data
    },
    // 校验是否含有价值选项
    async checkHasValue() {
      const {data: res} = await getOptimizationEvent({
        appId: this.campaignForm.appId,
        objective: this.campaignForm.objectiveType,
        optimizationGoal: 'VALUE',
        placement: "PLACEMENT_TIKTOK",
        platformId: this.campaignForm.platformId,
        refresh: true
      })
      this.isHasValue = res.data.some(item => item.value.startsWith('PURCHASE'))
    },
    // 获取应用内事件
    async getOptimizationEventList(refresh) {
      // if (this.optimizationEventLoading) return
      this.optimizationEventLoading = true
      const {data: res} = await getOptimizationEvent({
        appId: this.campaignForm.appId,
        objective: this.campaignForm.objectiveType,
        optimizationGoal: this.adGroupForm.optimizationGoal,
        placement: this.adGroupForm.placement.join(','),
        platformId: this.campaignForm.platformId,
        // appId: '6805332408808849413',
        // objective: 'APP_INSTALL',
        // optimizationGoal: 'IN_APP_EVENT',
        // placement: 'PLACEMENT_TIKTOK',
        // platformId: '7122055146649042946',
        refresh: refresh || false
      }).finally(() => {
        this.optimizationEventLoading = false
      })
      // console.log('事件', res)
      const serverEventList = res.data.map(item => item.value);
      this.optimizationEventList.forEach(item => {
        if (serverEventList.includes(item.value)) {
          item.disabled = false;
        } else {
          item.disabled = true;
        }
      })
      this.optimizationEventList.sort((a, b) => {
        return a.disabled - b.disabled
      })
      // this.optimizationEventList = res.data
    },
    // 优化目标选择后事件
    handleChangeOptimizationGoal(val) {
      if (val === 'VALUE') {
        this.$message.info('您选择了创建价值广告，请确保当前账户具备创建价值广告的能力。')
      }
      this.adGroupForm.optimizationEvent = ''
      if (val === 'IN_APP_EVENT' || val === 'INSTALL_IN_APP_EVENT') {
        this.getOptimizationEventList()
      } else {
        //   this.optimizationEventList = []
      }
      if (val === 'INSTALL') {
        this.adGroupForm.bidType = 'BID_TYPE_NO_BID'
      } else {
        this.adGroupForm.bidType = 'BID_TYPE_CUSTOM'
      }
      this.adGroupForm.roasBid = ''
    },
    // 从campaign进入adgroup
    campaignGotoAdGroup() {
      if (this.nextStepLoading) return
      this.saveDraft()
      this.$refs.campaignForm.validate(async (valid, err) => {
        if (valid) {
          // const check = await this.checkCampaignNameForCreate()
          // if (check) {
          this.getLocationTree()
          this.checkHasValue()
          this.curCampaipnId = ''
          // this.getLevelQuota()
          this.campaignStep = 2
          // }
        } else {
          Object.keys(err).forEach((key, i) => {
            const propName = err[key][0].field
            if (i === 0) {
              this.$refs['campaign-' + propName].$el.scrollIntoView({
                // 值有start,center,end，nearest，当前显示在视图区域中间
                block: 'end',
                // 值有auto、instant,smooth，缓动动画（当前是慢速的）
                behavior: 'smooth'
              })
              // console.log(propName)
            }
          })
        }
      })
    },
    // 获取地区
    async getLocationTree() {
      const {data: res} = await getLocationTree({
        placements: this.adGroupForm.placementType === 'PLACEMENT_TYPE_AUTOMATIC'
          ? 'PLACEMENT_TIKTOK,PLACEMENT_PANGLE'
          : this.adGroupForm.placement.join(',')
      })
      this.locationList = res.data
    },
    // 清除已选国家
    clearLocationParams() {
      this.adGroupForm.groupList.forEach(item => {
        item.locationIds = []
      })
      this.adGroupForm.locationIdsArr = [[]]
      this.adGroupForm.locationIds = []
    },
    // 从adgroup进入ad
    adGroupGotoAd() {
      if (this.nextStepLoading) return
      this.saveDraft()
      if (this.campaignForm.ios14Camppaign) {
        if (this.renderAdGroupList.length > this.levelQuota.adgroupQuota.availableQuota)
          return this.$message.warning('超过IOS14剩余创建广告组额度')
      }
      this.$refs.adGroupForm.validate((valid, err) => {
        if (valid) {
          this.campaignStep = 3
          this.adForm.adList[0].adIdentityId = this.adForm.adIdentityId
          this.adForm.adList[0].adIdentityName = this.adForm.adIdentityName
          this.adForm.adList = this.adForm.adList.slice(0, 1)
          let distance = this.renderAdGroupList.length - this.adForm.adList.length
          if (distance > 0) {
            for (let i = 0; i < this.renderAdGroupList.length; i++) {
              if (this.adForm.adList.length < i + 1) {
                this.renderAdList.push([])
                this.adForm.adList.push(
                  {
                    // 广告名字
                    adName: '',
                    adGroup: this.renderAdGroupList[i].adgroupName,
                    // 素材列表
                    creativeList: [],
                    // 单文案
                    word: '',
                    // 多文案
                    words: [''],
                    // 素材格式
                    // 批量实现类型
                    autoCreateType: this.adGroupForm.creativeMaterialMode == 'CUSTOM' ? 1 : 2,
                    adFormat: 'SINGLE_VIDEO',
                    // 行动引导文案
                    callToAction: 'DOWNLOAD_NOW',
                    callToActionArr: [],
                    // 动态优选
                    callToActionType: '1',
                    // 发布者身份
                    adIdentityId: this.adForm.adIdentityId,
                    adIdentityName: this.adForm.adIdentityName,
                    // 落地页
                    pageId: '',
                    landingPageUrl: '',
                  })
              } else if (this.adForm.adList[i].creativeList.length == 0) {
                this.adForm.adList[i].adGroup = this.renderAdGroupList[i].adgroupName
                this.adForm.adList[i].autoCreateType = this.adGroupForm.creativeMaterialMode == 'CUSTOM' ? 1 : 2
                this.adForm.adList[i].adIdentityId = this.adForm.adIdentityId
                this.adForm.adList[i].adIdentityName = this.adForm.adIdentityName
              }

            }
          }
        } else {
          Object.keys(err).forEach((key, i) => {
            const propName = err[key][0].field
            if (i === 0) {
              this.$refs['adGroup-' + propName].$el.scrollIntoView({
                block: 'end',
                behavior: 'smooth'
              })
            }
          })
        }
      })
    },
    checkvideoRelated() {
      if (this.adGroupForm.videoUserAction.VIDEO_RELATED.length > 0 || this.adGroupForm.videoRelatedCategoryIds.length > 0 || this.adGroupForm.actionPeriod !== '') {
        if (this.adGroupForm.videoUserAction.VIDEO_RELATED.length > 0 && this.adGroupForm.videoRelatedCategoryIds.length > 0 && this.adGroupForm.actionPeriod !== '') {
          return true
        } else {
          this.$message.warning('请完善视频互动')
          return false
        }
      } else {
        return true
      }
    },
    checkcreatorRelated() {
      if (this.adGroupForm.videoUserAction.CREATOR_RELATED.length > 0 || this.adGroupForm.creatorRelatedCategoryIds.length > 0) {
        if (this.adGroupForm.videoUserAction.CREATOR_RELATED.length > 0 && this.adGroupForm.creatorRelatedCategoryIds.length > 0) {
          return true
        } else {
          this.$message.warning('请完善创作者互动')
          return false
        }
      } else {
        return true
      }
    },
    checkAdPage() {
      if (this.adForm.adList[this.curEditAdgroup].adIdentityId === '') return false
      if (this.adForm.adList[this.curEditAdgroup].creativeList.length > 0) {
        if (this.adForm.batch) { // 批量创建
          if (this.adForm.adList[this.curEditAdgroup].autoCreateType === 1) { // 对应
            if (this.adForm.adList[this.curEditAdgroup].creativeList.every(
              item => item.words.every(word => word !== ''))) {
              return true
            } else {
              this.$message.warning('请完善文案')
              this.$refs.adCreative.$el.scrollIntoView({
                block: 'end',
                behavior: 'smooth'
              })
              return false
            }
          } else { // 组合
            if (this.adForm.adList[this.curEditAdgroup].words.every(item => item !== '')) {
              if (this.checkForDuplicates(this.adForm.adList[this.curEditAdgroup].words)) {
                this.$message.warning('文案不允许重复')
                this.$refs.adCreative.$el.scrollIntoView({
                  block: 'end',
                  behavior: 'smooth'
                })
                return false
              } else {
                return true
              }

            } else {
              this.$message.warning('请完善文案')
              this.$refs.adCreative.$el.scrollIntoView({
                block: 'end',
                behavior: 'smooth'
              })
              return false
            }
          }
        } else { // 单个广告组
          if (this.adForm.adList[this.curEditAdgroup].word !== '') {
            return true
          } else {
            this.$message.warning('请完善文案')
            this.$refs.adCreative.$el.scrollIntoView({
              block: 'end',
              behavior: 'smooth'
            })
            return false
          }
        }
      } else {
        this.$message.warning('请添加素材')
        this.$refs.adCreative.$el.scrollIntoView({
          block: 'end',
          behavior: 'smooth'
        })
        return false
      }
    },
    // 检查重复文案
    checkForDuplicates(array) {
      return new Set(array).size !== array.length
    },
    // 获取campaign表格数据
    async getCampaignTableData() {
      const excludeCol = this.defaultSettingColumn.map(item => item.value)
      this.campaignLoading = true
      const transformQuery = _.cloneDeep(this.transformQueryForm)
      delete transformQuery.campaignIds
      const {data: res} = await getTiktokCampaignPage(this.campaignPage, {
        offerId: this.offerId,
        // ...this.transformQueryAudienceDate,
        // ...this.queryFilterInfo,
        ...transformQuery,
        basicAndEventData: _.compact(this.tableColumnData.map(item => {
          if (item.value.startsWith('appEvent.')) {
            return item.value.substr(9)
          } else {
            if (!excludeCol.includes(item.value)) {
              return item.value
            }
          }
        })).join(','),
        sortMapStr: this.sortMap.hasOwnProperty('name') ? JSON.stringify(this.sortMap) : ''
      }).finally(() => {
        this.campaignLoading = false
      })
      const {data: total} = await getCampaignTotalData({
        offerId: this.offerId,
        ...transformQuery,
        basicAndEventData: _.compact(this.tableColumnData.map(item => {
          if (item.value.startsWith('appEvent.')) {
            return item.value.substr(9)
          } else {
            if (!excludeCol.includes(item.value)) {
              return item.value
            }
          }
        })).join(','),
        sortMapStr: this.sortMap.hasOwnProperty('name') ? JSON.stringify(this.sortMap) : ''
      })
      this.campaignTotalData = total.data
      this.campaignTotal = res.data.total
      this.campaignTableData = res.data.records.map(item => {
        item.showOpt = 0
        item.showBudget = 0
        return item
      })
      this.queryCampaignIds = this.campaignTableData.map(item => item.id).join(',')
      await this.getTiktokCampaignEventData()
    },
    // 获取事件数据
    async getTiktokCampaignEventData() {
      if (this.queryCampaignIds === '') return
      const excludeCol = this.defaultSettingColumn.map(item => item.value)
      NProgress.configure({parent: '#campaign-table'});
      NProgress.start();
      const {data: res} = await getTiktokCampaignEventData({
        offerId: this.offerId,
        ...this.transformQueryAudienceDate,
        basicAndEventData: _.compact(this.tableColumnData.map(item => {
          if (item.value.startsWith('appEvent.')) {
            return item.value.substr(9)
          } else {
            if (!excludeCol.includes(item.value)) {
              return item.value
            }
          }
        })).join(','),
        campaignIds: this.queryCampaignIds
      }).finally(() => {
        NProgress.done();
        NProgress.configure({parent: 'body'})
      })
      const _data = res.data
      this.campaignTableData.forEach(item1 => {
        const row = _data.find(item2 => item2.id === item1.id)
        if (row.appEvent !== null) {
          this.$set(item1, 'appEvent', row.appEvent)
        }
        // 更新远程数据
        for (const basicFieldKey in row.basicField) {
          this.$set(item1, basicFieldKey, row.basicField[basicFieldKey])
        }
      })
    },
    handleCampaignSizeChange(val) {
      this.campaignPage.current = 1
      this.campaignPage.size = val
      this.getCampaignTableData()
    },
    handleCampaignCurrentChange(val) {
      this.campaignPage.current = val
      this.getCampaignTableData()
    },
    //  type:index; level :campaign,adGroup,ad
    formatterTtStatus(value, type, level) {
      if (type == null || type == undefined) {
        type = 'index';
      }
      let status = this.ttStatusList[level];
      if (status != undefined && status != null) {
        let data = status.filter(item => {
          return item[type] == value;
        })
        if (data != null && data != undefined && data.length > 0) {
          return data[0].label;
        }
        return '';
      }
      return "";

    },
    // 勾选roas框触发
    handleRoasCheck(val) {
      if (val) {
        this.adGroupForm.deepBidType = 'VO_MIN_ROAS'
        this.adGroupForm.bidType = 'BID_TYPE_NO_BID'
      } else {
        this.$refs.adGroupForm.clearValidate('roasBid')
        this.adGroupForm.deepBidType = 'VO_HIGHEST_VALUE'
        this.adGroupForm.bidType = 'BID_TYPE_NO_BID'
        this.adGroupForm.roasBid = ''
      }
    },
    // 任务列表编辑页面
    handleTaskEdit(row, type) {
      if (type === 'edit') {
        this.currentTaskId = row.id
      } else {
        this.currentTaskId = null
      }
      if (row.sourceData !== '') {
        const {mode} = JSON.parse(row.sourceData)
        if (mode === 1) {
          const {options, adGroupTableData, campaignForm} = JSON.parse(row.sourceData)
          this.copyCampaignOpt = options
          // this.$refs.campaignClone.setAdGroupTableData(adGroupTableData)
          this.copyCampaignDialog = true
          this.$nextTick(() => {
            this.$refs.campaignClone.setAdGroupTableData(adGroupTableData)
            this.$refs.campaignClone.setCurrentTaskId(row.id)
            this.$refs.campaignClone.setCampaignForm(campaignForm)
          })
        } else {
          this.invertContent(row.sourceData)
          if (row.status === 2) {
            this.campaignForm.campaignName = this.campaignForm.campaignName + "-copy"
          }
          this.pageType = 2
          this.campaignStep = 1
        }


      }

    },
    // 反显内容
    invertContent(json) {
      if (json === '') return
      const {campaignForm, adGroupForm, adForm} = JSON.parse(json)
      this.campaignForm = campaignForm
      this.adGroupForm = adGroupForm
      // 导入其他兴趣列表
      if (this.adGroupForm.interestsByKeywordIds.length > 0) {
        this.otherInterestList = adGroupForm.interestsByKeyword
      } else {
        this.otherInterestList = []
      }
      this.adForm = adForm
      this.currentAccountId = this.campaignForm.platformId
      this.getAccountListByAppId()
      this.handleChangeIos14Switch(this.campaignForm.ios14Camppaign)
      this.getLandingPageList()
      this.getIdentityList()
      this.createRenderAdGroup()
      this.createRenderAdList()
    },
    async getAdGroupTableData() {
      const excludeCol = this.defaultSettingColumn.map(item => item.value)
      this.adGroupLoading = true
      const transformQuery = _.cloneDeep(this.transformQueryForm)
      delete transformQuery.adGroupIds
      const {data: res} = await getAdGroupPage(this.adGroupPage, {
        offerId: this.offerId,
        // ...this.transformQueryAudienceDate,
        // ...this.queryFilterInfo,
        ...transformQuery,
        basicAndEventData: _.compact(this.tableColumnData.map(item => {
          if (item.value.startsWith('appEvent.')) {
            return item.value.substr(9)
          } else {
            if (!excludeCol.includes(item.value)) {
              return item.value
            }
          }
        })).join(','),
        sortMapStr: this.sortMap.hasOwnProperty('name') ? JSON.stringify(this.sortMap) : ''
      }).finally(() => {
        this.adGroupLoading = false
      })
      const {data: total} = await getAdGroupTotalData({
        offerId: this.offerId,
        ...transformQuery,
        basicAndEventData: _.compact(this.tableColumnData.map(item => {
          if (item.value.startsWith('appEvent.')) {
            return item.value.substr(9)
          } else {
            if (!excludeCol.includes(item.value)) {
              return item.value
            }
          }
        })).join(','),
        sortMapStr: this.sortMap.hasOwnProperty('name') ? JSON.stringify(this.sortMap) : ''
      })
      this.adGroupTotalData = total.data
      this.adGroupTotal = res.data.total
      this.adGroupTableData = res.data.records.map(item => {
        item.showOpt = 0
        item.showBudget = 0
        item.showBids = 0
        return item
      })
      this.queryAdGroupIds = this.adGroupTableData.map(item => item.id).join(',')
      await this.getTiktokAdGroupEventData()
    },
    async getTiktokAdGroupEventData() {
      if (this.queryAdGroupIds === '') return
      const excludeCol = this.defaultSettingColumn.map(item => item.value)
      NProgress.configure({parent: '#ad-group-table'});
      NProgress.start();
      const {data: res} = await getTiktokAdGroupEventData({
        offerId: this.offerId,
        ...this.transformQueryAudienceDate,
        basicAndEventData: _.compact(this.tableColumnData.map(item => {
          if (item.value.startsWith('appEvent.')) {
            return item.value.substr(9)
          } else {
            if (!excludeCol.includes(item.value)) {
              return item.value
            }
          }
        })).join(','),
        adGroupIds: this.queryAdGroupIds
      }).finally(() => {
        NProgress.done();
        NProgress.configure({parent: 'body'})
      })
      const _data = res.data
      this.adGroupTableData.forEach(item1 => {
        const row = _data.find(item2 => item2.id === item1.id)
        // console.log(item1)
        if (row.appEvent !== null) {
          this.$set(item1, 'appEvent', row.appEvent)
        }
        // 更新远程数据
        for (const basicFieldKey in row.basicField) {
          this.$set(item1, basicFieldKey, row.basicField[basicFieldKey])
        }
      })
    },
    handleAdGroupSizeChange(val) {
      this.adGroupPage.size = val
      this.adGroupPage.current = 1
      this.getAdGroupTableData()
    },
    handleAdGroupCurrentChange(val) {
      this.adGroupPage.current = val
      this.getAdGroupTableData()
    },
    async getAdTableData() {
      const excludeCol = this.defaultSettingColumn.map(item => item.value)
      this.adLoading = true
      const {data: res} = await getAdPage(this.adPage, {
        // ...this.transformQueryAudienceDate,
        // ...this.queryFilterInfo,
        ...this.transformQueryForm,
        offerId: this.offerId,
        basicAndEventData: _.compact(this.tableColumnData.map(item => {
          if (item.value.startsWith('appEvent.')) {
            return item.value.substr(9)
          } else {
            if (!excludeCol.includes(item.value)) {
              return item.value
            }
          }
        })).join(','),
        sortMapStr: this.sortMap.hasOwnProperty('name') ? JSON.stringify(this.sortMap) : ''
      }).finally(() => {
        this.adLoading = false
      })
      const {data: total} = await getAdTotalData({
        ...this.transformQueryForm,
        offerId: this.offerId,
        basicAndEventData: _.compact(this.tableColumnData.map(item => {
          if (item.value.startsWith('appEvent.')) {
            return item.value.substr(9)
          } else {
            if (!excludeCol.includes(item.value)) {
              return item.value
            }
          }
        })).join(','),
        sortMapStr: this.sortMap.hasOwnProperty('name') ? JSON.stringify(this.sortMap) : ''
      })
      this.adTotalData = total.data
      this.adTotal = res.data.total
      this.adTableData = res.data.records
      this.queryAdIds = this.adTableData.map(item => item.id).join(',')
      await this.getTiktokAdEventData()
    },
    async getTiktokAdEventData() {
      if (this.queryAdIds === '') return
      const excludeCol = this.defaultSettingColumn.map(item => item.value)
      NProgress.configure({parent: '#ad-table'});
      NProgress.start();
      const {data: res} = await getTiktokAdEventData({
        offerId: this.offerId,
        ...this.transformQueryAudienceDate,
        basicAndEventData: _.compact(this.tableColumnData.map(item => {
          if (item.value.startsWith('appEvent.')) {
            return item.value.substr(9)
          } else {
            if (!excludeCol.includes(item.value)) {
              return item.value
            }
          }
        })).join(','),
        adIds: this.queryAdIds
      }).finally(() => {
        NProgress.done();
        NProgress.configure({parent: 'body'})
      })
      const _data = res.data
      this.adTableData.forEach(item1 => {
        const row = _data.find(item2 => item2.id === item1.id)
        if (row.appEvent !== null) {
          this.$set(item1, 'appEvent', row.appEvent)
        }
        // 更新远程数据
        for (const basicFieldKey in row.basicField) {
          this.$set(item1, basicFieldKey, row.basicField[basicFieldKey])
        }
      })
    },
    handleAdSizeChange(val) {
      this.adPage.size = val
      this.adPage.current = 1
      this.getAdTableData()
    },
    handleAdCurrentChange(val) {
      this.adPage.current = val
      this.getAdTableData()
    },
    async getIdentityList(refresh) {
      this.identityBtnLoading = true
      const {data: res} = await getTtIdentity({
        refresh: refresh || false,
        platformId: this.campaignForm.platformId,
        platformAppId: this.campaignForm.platformAppId
      }).finally(() => {
        this.identityBtnLoading = false
      })
      this.identityList = res.data
      if (this.adForm.adIdentityId === '') {
        if (res.data.length > 0) {
          this.adForm.adIdentityId = res.data[0].identityId
          this.adForm.adIdentityName = res.data[0].displayName
        } else {
          this.adForm.adIdentityId = this.campaignForm.appName
          this.adForm.adIdentityName = this.campaignForm.appName
          this.identityList = [{displayName: this.campaignForm.appName, identityId: this.campaignForm.appName}]
        }
      } else {
        if (!this.identityList.some(item => item.identityId === this.adForm.adIdentityId)) {
          this.adForm.adIdentityId = ''
        }
      }
    },
    addIdentity() {
      if (this.addIdentityLoading) return
      this.$refs.identityForm.validate(async valid => {
        if (!valid) return
        this.addIdentityLoading = true
        const {data: res} = await createTtIdentity({
          platformId: this.campaignForm.platformId,
          platformAppId: this.campaignForm.appId,
          displayName: this.identityForm.value,
          logoUrl: this.logoUrl
        }).finally(() => {
          this.addIdentityLoading = false
        })
        this.identityList.push(res.data)
        this.$message.success('添加自定义身份成功')
        // await this.getIdentityList()
        this.identityForm.value = ''
        this.addIdentityDialog = false
      })
    },
    // 改变广告组状态
    async changeAdGroupStatus(row) {
      let title = row.operationStatus === 'ENABLE' ? '确认关闭下面的广告组吗' : '确认开启下面的广告组吗?'
      let msg = row.campaignName
      this.$confirm(msg, title, {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        changeAdGroupStatus(
          {
            adGroupId: row.id,
            operationStatus: row.operationStatus === 'ENABLE' ? 'DISABLE' : 'ENABLE'
          }
        ).then(res => {
          if (res.data.code !== 200) {
            this.$message.error('更新广告组状态失败')
          } else {
            row.operationStatus = row.operationStatus === 'ENABLE' ? 'DISABLE' : 'ENABLE'
            this.$message.success('更新广告组状态成功')
          }
        }).catch(() => {
          this.$message.error('更新广告组状态失败')
        })
        this.$message.success('更新广告组状态成功')
      })
    },
    // 改变推广系列状态
    async changeCampaignStatus(row) {
      let title = row.operationStatus === 'ENABLE' ? '确认关闭下面的推广系列吗' : '确认开启下面的推广系列吗?'
      let msg = row.campaignName
      this.$confirm(msg, title, {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        changeCampaignStatus(
          {
            campaignId: row.id,
            operationStatus: row.operationStatus === 'ENABLE' ? 'DISABLE' : 'ENABLE'
          }
        ).then(res => {
          if (res.data.code !== 200) {
            this.$message.error('更新推广系列状态失败')
          } else {
            row.operationStatus = row.operationStatus === 'ENABLE' ? 'DISABLE' : 'ENABLE'
            this.$message.success('更新推广系列状态成功')
          }
        }).catch(() => {
          this.$message.error('更新推广系列状态失败')
        })
      })
    },
    // 改变广告状态
    async changeAdStatus(row) {
      let title = row.operationStatus === 'ENABLE' ? '确认关闭下面的广告吗' : '确认开启下面的广告吗?'
      let msg = row.adName
      if (row.creativeMaterialMode === 'DYNAMIC') {
        msg = " 所选的广告包含程序化创意(ACO)。如果所有广告均保持投放状态，则ACO推广系列的效果会更好。你确定要暂停广告吗?\n"
          + msg + "  " + "(ACO)"
      }
      this.$confirm(msg, title, {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        changeAdStatus(
          {
            adId: row.id,
            operationStatus: row.operationStatus === 'ENABLE' ? 'DISABLE' : 'ENABLE'
          }
        ).then(res => {
          if (res.data.code !== 200) {
            this.$message.error('更新广告状态失败')
          } else {
            row.operationStatus = row.operationStatus === 'ENABLE' ? 'DISABLE' : 'ENABLE'
            this.$message.success('更新广告状态成功')
          }
        }).catch(() => {
          this.$message.error('更新广告状态失败')
        })
      })
    },
    // 显示复制推广系列弹窗
    async showCopyCampaignDialog(row) {
      // const {data: res} = await checkCopyable({
      //   campaignId: row.id,
      //   level: 'campaign'
      // })
      // if (res.code !== 200) return this.$message.error(res.msg)
      //
      this.currentTaskId = null
      this.copyCampaignOpt = _.cloneDeep(row)
      this.copyCampaignDialog = true
    },
    copyCampaign() {
      this.copyCampaignDialog = false
      this.opeType = 2
      this.invertContent(this.copyCampaignForm.sourceData)
      this.campaignForm.campaignName = this.copyCampaignForm.campaignName
      // this.campaignForm.platformId = this.copyCampaignForm.platformId
      // this.campaignForm.appId = ''
      // 获取受众
      this.getIdentityList()
      this.getAudiencesList()
      this.getAccountListByAppId()
      this.adGroupForm.scheduleStartTime = Moment().utc().add(this.timezone, "hours").format("yyyy-MM-DD HH:mm:ss")
      this.adGroupForm.scheduleEndTime = Moment().utc().add(this.timezone, "hours").add(14, "days").format("yyyy-MM-DD HH:mm:ss")
      this.pageType = 2
      this.campaignStep = 1
    },
    handleChangeCreativeDate(val) {
      if (val !== null) {
        this.creativeQueryForm.beginDate = val[0]
        this.creativeQueryForm.endDate = val[1]
      } else {
        this.creativeQueryForm.beginDate = null
        this.creativeQueryForm.endDate = null
      }
    },
    gotoAdGroupTable(row) {
      this.adGroupPage.current = 1
      this.adGroupPage.size = 10
      // this.queryFilterInfo = {campaignIds: row.id}
      this.curSelCpId = row.id
      // delete this.queryFilterInfo.campaignIds
      this.activeName = 'adGroup'
      this.getAdGroupTableData()
    },
    gotoAdTable(row) {
      this.adPage.current = 1
      this.adPage.size = 10
      this.curSelAgId = row.id
      this.activeName = 'ad'
      this.getAdTableData()
    },
    showEditCampaignName(row) {
      this.editCampaignDialog = true
      this.editCampaigForm.campaignName = row.campaignName
      this.editCampaigForm.campaignId = row.id
    },
    editCampaignName() {
      if (this.editNameBtnLoading) return
      this.$refs.editCampaigForm.validate(async vaild => {
        if (vaild) {
          this.editNameBtnLoading = true
          await updateCampaignName(this.editCampaigForm).finally(() => {
            this.editCampaignDialog = false
            this.editNameBtnLoading = false
          })
          this.$message.success('修改推广系列名称成功')
          await this.getCampaignTableData()
        }
      })
    },
    showEditAdGroupName(row) {
      this.editAdGroupDialog = true
      this.editAdGroupForm.groupName = row.adgroupName
      this.editAdGroupForm.adGroupId = row.id
    },
    editAdGroupName() {
      if (this.editNameBtnLoading) return
      this.$refs.editAdGroupForm.validate(async vaild => {
        if (vaild) {
          this.editNameBtnLoading = true
          await updateGroupName(this.editAdGroupForm).finally(() => {
            this.editAdGroupDialog = false
            this.editNameBtnLoading = false
          })
          this.$message.success('修改广告组名称成功')
          await this.getAdGroupTableData()
        }
      })
    },
    showEditAdName(row) {
      this.editAdDialog = true
      this.editAdForm.adName = row.adName
      this.editAdForm.adId = row.id
    },
    editAdName() {
      if (this.editNameBtnLoading) return
      this.$refs.editAdForm.validate(async vaild => {
        if (vaild) {
          this.editNameBtnLoading = true
          await updateAdName(this.editAdForm).finally(() => {
            this.editAdDialog = false
            this.editNameBtnLoading = false
          })
          this.$message.success('修改广告名称成功')
          await this.getAdTableData()
        }
      })
    },
    // 保存草稿
    async saveDraft() {
      const {data: res} = await saveTask({
        offerId: this.offerId,
        id: this.currentTaskId,
        name: this.campaignForm.campaignName,
        sourceData: JSON.stringify({
          campaignForm: this.campaignForm,
          adGroupForm: this.adGroupForm,
          adForm: this.adForm
        })
      })
      // this.$message.success('保存草稿成功')
      this.currentTaskId = res.data.id
    },
    // 推广系列预算选择处理
    handleCampaignBudgetChange(val) {
      this.$refs.campaignForm.clearValidate('budget')
      this.adGroupForm.budgetMode = val
      if (val === 'BUDGET_MODE_TOTAL') {
        this.adGroupForm.scheduleType = 'SCHEDULE_START_END'
      } else {
        this.adGroupForm.scheduleType = 'SCHEDULE_FROM_NOW'
      }
    },
    // 推广系列预算选择处理
    handleAdGroupBudgetChange(val) {
      this.$refs.adGroupForm.clearValidate('budget')
      if (val === 'BUDGET_MODE_TOTAL') {
        this.adGroupForm.scheduleType = 'SCHEDULE_START_END'
      } else {
        this.adGroupForm.scheduleType = 'SCHEDULE_FROM_NOW'
      }

    },
    // 切换tab页事件
    handleClickTab(tab) {
      // if (this.selectedCampaigns.length === 0 && this.selectedAdGroups.length === 0) {
      //   this.$refs.csFilterQueryRef.clear()
      // }
      this.sortMap = {}
      this.curSelCpId = ''
      this.curSelAgId = ''
      switch (tab.name) {
        case 'campaign':
          this.campaignPage.size = 10
          this.campaignPage.current = 1
          // if (this.selectedCampaigns.length === 0 && this.selectedAdGroups.length === 0) {
          //   this.$refs.csFilterQueryRef.clear()
          // } else {
          if (this.refreshByChangeTabs) {
            this.getCampaignTableData()
          }
          // }
          break
        case 'adGroup':
          this.adGroupPage.size = 10
          this.adGroupPage.current = 1
          // if (this.selectedCampaigns.length === 0 && this.selectedAdGroups.length === 0) {
          //   this.$refs.csFilterQueryRef.clear()
          // } else {
          if (this.refreshByChangeTabs) {
            this.getAdGroupTableData()
          }
          // }
          break
        case 'ad':
          this.adPage.current = 1
          this.adPage.size = 10
          // if (this.selectedCampaigns.length === 0 && this.selectedAdGroups.length === 0) {
          //   this.$refs.csFilterQueryRef.clear()
          // } else {
          if (this.refreshByChangeTabs) {
            this.getAdTableData()
          }
          // }
          break
      }
    },
    // 文案输入框查询
    queryCreativeTextSearch(queryString, cb) {

      // var results = queryString ? restaurants.filter(this.createFilter(queryString)) : restaurants;
      // 调用 callback 返回建议列表的数据
      cb(this.transformCreativeText(queryString));
    },
    transformCreativeText(queryString) {
      if (queryString === '') {
        return this.textData.map(item => {
          return {value: item.text}
        })
      } else {
        return this.textData.filter(item => {
          const input = queryString.toLowerCase()
          const text = item.text.toLowerCase()
          return text.includes(input)
        }).map(item => {
          return {value: item.text}
        })
      }
    },
    async queryInterestsByKeyword(queryString) {
      this.queryInterestsLoading = true
      const {data: res} = await getInterestByKeyword(this.currentAccountId, queryString).finally(() => {
        this.queryInterestsLoading = false
      })
      this.otherInterestList = res.data

    },
    handleChangeOtherInterest(val) {
      const prop = this.otherInterestList.filter(item => val.includes(item.id))
      this.adGroupForm.interestsByKeyword.push(...prop)
      this.adGroupForm.interestsByKeyword = _.uniqWith(this.adGroupForm.interestsByKeyword, _.isEqual)
    },
    // 选择竞价的策略处理
    handleChangeBidType(val) {
      this.$refs.adGroupForm.clearValidate('bidPrice')
      this.adGroupForm.bidPrice = ''
      this.adGroupForm.conversionBidPrice = ''
      this.adGroupForm.pacing = 'PACING_MODE_SMOOTH'
    },
    // 获取广告受众数据
    async getAdAudiencesDataList() {
      if (this.selectedAds.length <= 0) return this.$message.warning('请至少选择一条广告')
      this.adLoading = true
      const excludeCol = this.defaultSettingColumn.map(item => item.value)
      const {data: res} = await getAdAudiencesDataList({
        adIds: this.selectedAds.map(item => item.id).join(','),
        dimensions: this.adAudience,
        basicAndEventData: _.compact(this.tableColumnData.map(item => {
          if (item.value.startsWith('appEvent.')) {
            return item.value.substr(9)
          } else {
            if (!excludeCol.includes(item.value)) {
              return item.value
            }
          }
        })).join(','),
        ...this.transformQueryAudienceDate
      }).finally(() => {
        this.adLoading = false
      })
      const _data = res.data
      this.adTableData.forEach(item1 => {
        const row = _data.find(item2 => item2.id === item1.id)
        if (row !== undefined && row.items.length > 0) {
          this.$set(item1, 'children', row.items)
        }
      })
    },
    // 获取推广系列受众数据
    async getCampaignAudiencesDataList() {
      if (this.selectedCampaigns.length <= 0) return this.$message.warning('请至少选择一条推广系列')
      this.campaignLoading = true
      const excludeCol = this.defaultSettingColumn.map(item => item.value)
      const {data: res} = await getCampaignAudiencesDataList({
        campaignIds: this.selectedCampaigns.map(item => item.id).join(','),
        dimensions: this.campaignAudience,
        basicAndEventData: _.compact(this.tableColumnData.map(item => {
          if (item.value.startsWith('appEvent.')) {
            return item.value.substr(9)
          } else {
            if (!excludeCol.includes(item.value)) {
              return item.value
            }
          }
        })).join(','),
        ...this.transformQueryAudienceDate
      }).finally(() => {
        this.campaignLoading = false
      })
      const _data = res.data
      this.campaignTableData.forEach(item1 => {
        const row = _data.find(item2 => item2.id === item1.id)
        if (row !== undefined) {
          if (row.items.length > 0) {
            this.$set(item1, 'children', row.items)
          } else if (row.items.length === 0) {
            this.$set(item1, 'children', [])
          }
        } else {
          this.$set(item1, 'children', [])
        }
      })
    },
    // 广告组受众数据查询
    async getAdGroupAudiencesDataList() {
      if (this.selectedAdGroups.length <= 0) return this.$message.warning('请至少选择一条广告组')
      this.adGroupLoading = true
      const excludeCol = this.defaultSettingColumn.map(item => item.value)
      const {data: res} = await getAdGroupAudiencesDataList({
        adGroupIds: this.selectedAdGroups.map(item => item.id).join(','),
        dimensions: this.adGroupAudience,
        basicAndEventData: _.compact(this.tableColumnData.map(item => {
          if (item.value.startsWith('appEvent.')) {
            return item.value.substr(9)
          } else {
            if (!excludeCol.includes(item.value)) {
              return item.value
            }
          }
        })).join(','),
        ...this.transformQueryAudienceDate
      }).finally(() => {
        this.adGroupLoading = false
      })
      const _data = res.data
      this.adGroupTableData.forEach(item1 => {
        const row = _data.find(item2 => item2.id === item1.id)
        if (row !== undefined && row.items.length > 0) {
          this.$set(item1, 'children', row.items)
        }
      })
    },
    // 根据标签页查数据
    getAudiencesDataByTab() {
      switch (this.activeName) {
        case 'campaign':
          this.getDataByTab()
          if (this.campaignAudience === '') return
          if (this.selectedCampaigns.length === 0) return
          this.getCampaignAudiencesDataList()
          break
        case 'adGroup':
          this.getDataByTab()
          if (this.adGroupAudience === '') return
          if (this.selectedAdGroups.length === 0) return
          this.getAdGroupAudiencesDataList()
          break
        case 'ad':
          this.getDataByTab()
          if (this.this.adAudience === '') return
          if (this.selectedAds.length === 0) return
          this.getAdAudiencesDataList()
          break
      }
    },
    //
    async handleChangeIos14Switch(val) {
      if (val) {
        const {data: res} = await getIos14Quota({
          appId: this.campaignForm.appId,
          platformId: this.campaignForm.platformId
        })
        if (res.data.campaignQuota.availableQuota < 1) {
          this.campaignForm.ios14Camppaign = false
          this.campaignForm.campaignAppProfilePageState = 'OFF'
          // this.disabledCreativeMaterialMode = false
          return this.$message.error('应用已达到 iOS 14 专属推广系列限额。 要创建新推广系列，请删除或关闭现有的某个推广系列')
        } else {
          this.levelQuota = res.data
        }
      }
    },
    // // 获取层级配额
    async getLevelQuota() {
      const {data: res} = await getIos14Quota({
        appId: this.campaignForm.appId,
        platformId: this.campaignForm.platformId
      })
      this.levelQuota = res.data
    },
    handleChangeAdGroupFormAudienceIds() {
      this.adGroupForm.audienceIds = this.$refs.adGroupFormAudienceIds.getCheckedNodes(true).map(item => item.value)
      this.setAudienceDisabled(this.excludedAudiencesList, this.adGroupForm.audienceIds)
    },
    handleChangeAdGroupFormExcludedAudienceIds() {
      this.adGroupForm.excludedAudienceIds = this.$refs.adGroupFormExcludedAudienceIds.getCheckedNodes(true).map(item => item.value)
      this.setAudienceDisabled(this.audiencesList, this.adGroupForm.excludedAudienceIds)
    },
    // 受众选择与排除方法
    setAudienceDisabled(Audiencelist, checked) {
      // console.log(Audiencelist, checked)
      Audiencelist.forEach(item => {
        this.$set(item, 'disabled', false)
        item.disabled = false
        if (item.hasOwnProperty('children') && item.children.length > 0) {
          this.setAudienceDisabled(item.children, checked)
        } else {
          if (checked.includes(item.audienceId)) {
            this.$set(item, 'disabled', true)
          } else {
            // item.disabled = false
          }
        }
      })

    },
    // 显示复制广告组弹窗
    async showCopyAdGroupDialog(row) {
      console.log('复制广告组', row)
      this.copyAdGroupFormIsAdd = false
      this.clearCreateFromData()
      this.disabledCreativeMaterialMode = true
      this.copyAdGroupForm = {
        num: 1,
        isCreateCampaign: true,
        campaignName: '推广系列-' + Moment().format("yyyyMMDDHHmmss"),
        campaignId: row.campaignId
      }
      this.copyAdGroupForm.clone = _.cloneDeep(row)
      this.copyAdGroupDialog = true
      await this.getCampaignList(row)
      this.handleChangeCampaignByAdGroup(row.campaignId)
    },
    // 获取所有的campaign列表
    async getCampaignList(row = {}) {
      let campaignTypes = "";
      if (row.campaignAppProfilePageState != undefined) {
        campaignTypes = row.campaignAppProfilePageState === 'ON' ? 'SPC_0,APPO_ON' : 'SPC_0,APPO_OFF';
      }
      this.copyBtnLoading = true
      const {data: res} = await getCampaignList({
        offerId: this.offerId,
        campaignTypes: campaignTypes,
        os: row.os || ''
      }).finally(() => {
        this.copyBtnLoading = false
      })
      this.campaignList = res.data
    },
    handleChangeCampaignByAdGroup(val) {
      this.curCampaipnId = val
      const campaign = this.campaignList.find(item => item.id == val)
      // console.log(campaign)
      if (campaign === undefined) return
      this.campaignForm.platformId = campaign.platformId
      this.campaignForm.appId = campaign.appId
      this.campaignForm.appName = campaign.appName
      this.campaignForm.os = campaign.os
      this.campaignForm.platformAppId = campaign.appId
      this.campaignForm.campaignAppProfilePageState = campaign.campaignAppProfilePageState
      this.campaignForm.campaignType = campaign.campaignType
      this.timezone = campaign.timezoneOffset
      this.currentAccountId = campaign.platformId
      const app = this.appList.find(item => item.platformAppId === this.campaignForm.appId)
      if (app === undefined) return
      this.adForm.clickTrackingUrl = app.clickTrackingUrl
      this.adForm.impressionTrackingUrl = app.impressionTrackingUrl
      this.getIdentityList()
      this.getAudiencesList()
    },
    // 复制广告组
    copyAdGroup() {
      this.$refs.copyAdGroupForm.validate(async valid => {
        if (!valid) return
        console.log(this.campaignForm)
        if (this.campaignForm.campaignType === 'IOS14_CAMPAIGN') {
          await this.getLevelQuota()
          if (this.levelQuota.adgroupQuota.availableQuota == 0) return this.$message.error('超过IOS14剩余创建广告组额度')
        }
        this.copyAdGroupDialog = false
        this.getLocationTree()
        this.adGroupForm.scheduleStartTime = Moment().utc().add(this.timezone, "hours").format("yyyy-MM-DD HH:mm:ss")
        this.adGroupForm.scheduleEndTime = Moment().utc().add(this.timezone, "hours").add(14, "days").format("yyyy-MM-DD HH:mm:ss")
        if (!this.copyAdGroupFormIsAdd) { // 复制
          // const {adForm,adGroupForm} = JSON.parse(this.copyAdGroupForm.clone.sourceData)
          this.setAdGroupFrom(this.copyAdGroupForm.clone)
          const {data: {data: adForm}} = await getFormatAdByAdGroup(this.copyAdGroupForm.clone.id, this.copyAdGroupForm.clone.creativeMaterialMode)
          // console.log(res)
          this.adForm.adList[0].adFormat = adForm.adFormat
          this.adForm.adIdentityId = adForm.adIdentityId
          this.adForm.adIdentityName = adForm.adIdentityName
          this.adForm.adList[0].callToAction = adForm.callToAction
          this.adForm.adList[0].callToActionType = adForm.callToActionType
          this.adForm.adList[0].clickTrackingUrl = adForm.clickTrackingUrl
          this.adForm.adList[0].creativeList = adForm.creativeList
          this.adForm.adList[0].impressionTrackingUrl = adForm.impressionTrackingUrl
          this.adForm.adList[0].sparkAdsSwitch = adForm.sparkAdsSwitch
          // 初始化
          if (this.copyAdGroupForm.clone.creativeMaterialMode === "DYNAMIC") {
            this.adForm.adList[0].autoCreateType = 2
            this.adForm.adList[0].words = adForm.words
            this.adForm.adList[0].callToActionArr = adForm.callToActionArr
          } else {
            this.adForm.adList[0].autoCreateType = 1
          }
          if (this.copyAdGroupForm.clone.campaignAppProfilePageState === 'ON') {
            this.adForm.adList[0].imageUrl = adForm.imageUrl
            this.adForm.adList[0].landingPageUrl = adForm.landingPageUrl
            this.adForm.adList[0].pageId = adForm.pageId
          }
          this.adGroupForm.locationIdsArr = [[]]
          this.adGroupForm.languagesArr = [[]]
          this.adGroupForm.genderArr = ['GENDER_UNLIMITED']
          this.adGroupForm.ageArr = [[]]
          this.adGroupForm.locationIds = []
          this.adGroupForm.languages = []
          this.adGroupForm.gender = 'GENDER_UNLIMITED'
          this.adGroupForm.age = []
          if (this.copyAdGroupForm.clone.campaignId === this.copyAdGroupForm.campaignId) {
            this.adGroupForm.adgroupName = this.copyAdGroupForm.clone.adgroupName + ' - copy'
          } else {
            this.adGroupForm.adgroupName = this.copyAdGroupForm.clone.adgroupName
          }
          this.adGroupForm.optimizationEvent = this.copyAdGroupForm.clone.optimizationEvent;
          this.adGroupForm.optimizationGoal = this.copyAdGroupForm.clone.optimizationGoal;
          this.setAudienceDisabled(this.excludedAudiencesList, this.adGroupForm.audienceIds)
          this.setAudienceDisabled(this.audiencesList, this.adGroupForm.excludedAudienceIds)
          // 遍历复制
          this.adGroupForm.groupList = []
          for (let i = 0; i < this.copyAdGroupForm.num; i++) {
            this.adGroupForm.groupList.push({
              adgroupName: this.copyAdGroupForm.clone.adgroupName + '-' + (i + 1),
              locationIds: this.copyAdGroupForm.clone.locationIds ? this.copyAdGroupForm.clone.locationIds.split(',') : [],
              languages: this.copyAdGroupForm.clone.languages ? this.copyAdGroupForm.clone.languages.split(',') : [],
              gender: this.copyAdGroupForm.clone.gender,
              age: this.copyAdGroupForm.clone.age ? this.copyAdGroupForm.clone.age.split(',') : []
            })
          }
          //调用获取应用事件
          await this.getOptimizationEventList(true);
          let optimizationEvent = this.optimizationEventList.find(item => {
            return item.value == this.adGroupForm.optimizationEvent;
          })
          // console.log('copy', this.adGroupForm.optimizationEvent)
          if (optimizationEvent == undefined) {
            this.adGroupForm.optimizationEvent = "";
          }
        } else {
          this.adGroupForm.adgroupName = '广告组-' + Moment().format("yyyyMMDDHHmmss")
        }
        if (this.campaignForm.campaignAppProfilePageState === 'ON') { // APPO
          this.getLandingPageList()
        }
        if (this.copyAdGroupForm.isCreateCampaign) {
          this.campaignStep = 1
          this.opeType = 1
          this.disabledAppSelect = true
          this.campaignForm.campaignName = this.copyAdGroupForm.campaignName
          this.campaignForm.appId = this.copyAdGroupForm.clone.appId
          this.handleChangeAppByCopy(this.copyAdGroupForm.clone.appId)
          this.campaignForm.platformId = ''
        } else {
          this.campaignStep = 2
          this.opeType = 3
          // const {data: {data: {ttAdList}}} = await getCopyAdgroupDetail({
          //   adGroupId: this.copyAdGroupForm.clone.id
          // })
          // this.copyAdGroupForm.clone.videoUserActions = JSON.parse(this.copyAdGroupForm.clone.videoUserActions)
          // this.copyAdGroupForm.clone.ttAdList = ttAdList
          // this.copyCampaignOpt = {
          //   appId: this.copyAdGroupForm.clone.appId,
          //   campaignName: this.copyAdGroupForm.clone.campaignName,
          //   campaignId: this.copyAdGroupForm.clone.campaignId,
          //   budget: this.copyAdGroupForm.clone.budget,
          //   budgetMode: this.copyAdGroupForm.clone.budgetMode,
          //   platformId: this.copyAdGroupForm.clone.platformId,
          //   isCopyAdGroup: true,
          //   adGroupTableData: [{...this.copyAdGroupForm.clone}]
          // }
          // this.copyCampaignDialog = true
        }
        this.pageType = 2
        this.createRenderAdList()
        this.createRenderAdGroup()
      })
    },
    // 显示复制广告弹窗
    async showCopyAdDialog(row) {
      console.log('复制广告', row)
      this.copyAdFormIsAdd = false
      this.clearCreateFromData()
      this.copyAdForm = {
        num: 1,
        isCreateCampaign: true,
        campaignId: row.campaignId,
        isCreateAdGroup: true,
        campaignName: '推广系列-' + Moment().format("yyyyMMDDHHmmss"),
        adGroupId: row.adGroupId,
        adGroupName: '推广系列-' + Moment().format("yyyyMMDDHHmmss")
      }
      this.copyAdForm.clone = _.cloneDeep(row)
      this.copyAdDialog = true
      await this.getCampaignList(row)
      await this.handleChangeCampaignByAd(row.campaignId)
      this.handleChangeAdGroupByAd(row.adGroupId)
    },
    // 查询所有广告组
    async getAdGroupList() {
      const {data: res} = await getAdGroupList({
        offerId: this.offerId,
        campaignId: this.copyAdForm.campaignId
      })
      this.adGroupList = res.data
    },
    handleChangeCampaignByAd(val) {
      this.curCampaipnId = val
      const campaign = this.campaignList.find(item => item.id === val)
      if (campaign === undefined) return
      this.campaignForm.platformId = campaign.platformId
      this.campaignForm.appId = campaign.appId
      this.campaignForm.os = campaign.os
      this.campaignForm.appName = campaign.appName
      this.campaignForm.campaignAppProfilePageState = campaign.campaignAppProfilePageState
      if (this.campaignForm.campaignAppProfilePageState === 'ON') {
        this.campaignForm.ios14Camppaign = true
      }
      this.timezone = campaign.timezoneOffset
      this.campaignForm.platformAppId = campaign.appId
      this.currentAccountId = campaign.platformId
      this.getIdentityList(true)
      this.getAdGroupList()
      this.copyAdForm.adGroupId = ''
    },
    handleChangeAdGroupByAd(val) {
      const adGroup = this.adGroupList.find(item => item.id === val)
      if (adGroup === undefined) return
      this.copyAdForm.adGroup = adGroup
    },
    copyAd() {
      this.$refs.copyAdForm.validate(async valid => {
        if (!valid) return
        // if (!this.copyAdForm.isCreateCampaign && this.copyAdForm.campaignId == '') return this.$message.warning('请选择推广系列')
        // if (!this.copyAdForm.isCreateAdGroup && this.copyAdForm.adGroupId == '') return this.$message.warning('请选择广告组')
        this.copyAdDialog = false
        this.getLocationTree()
        if (!this.copyAdFormIsAdd) {
          this.setAdForm(this.copyAdForm.clone)
          const {data: res} = await selectone(this.copyAdForm.clone.creativeId)
          // const {adForm} = JSON.parse(this.copyAdForm.clone.sourceData)
          // this.adForm = adForm
          this.adForm.adList[this.curEditAdgroup].autoCreateType = 1
          res.words = []
          for (let i = 0; i < this.copyAdForm.num; i++) {
            res.words.push(this.copyAdForm.clone.adText)
          }
          if (this.copyAdForm.adGroupId === this.copyAdForm.clone.adGroupId) {
            res.name = this.copyAdForm.clone.adName + '-copy'
          } else {
            res.name = this.copyAdForm.clone.adName
          }
          this.adForm.adList[this.curEditAdgroup].creativeList = [res]
        }
        if (this.campaignForm.campaignAppProfilePageState === 'ON') { // APPO
          this.getLandingPageList()
        }
        this.pageType = 2
        if (this.copyAdForm.isCreateCampaign) { // 创建
          this.campaignForm.appId = ''
          this.campaignForm.platformId = ''
          this.campaignForm.campaignName = this.copyAdForm.campaignName
          this.opeType = 1
          this.campaignStep = 1
        } else {
          if (this.copyAdForm.isCreateAdGroup) {
            this.adGroupForm.adgroupName = this.copyAdForm.adGroupName
            this.copyAdGroupForm.campaignId = this.copyAdForm.campaignId
            this.opeType = 3
            this.campaignStep = 2
          } else {
            this.adGroupForm.batch = false
            this.adGroupForm.adgroupName = this.copyAdForm.adGroup.adgroupName
            this.adGroupForm.locationIds = this.copyAdForm.adGroup.locationIds ? this.copyAdForm.adGroup.locationIds.split(',') : []
            this.adGroupForm.languages = this.copyAdForm.adGroup.languages ? this.copyAdForm.adGroup.languages.split(',') : []
            this.adGroupForm.age = this.copyAdForm.adGroup.age ? this.copyAdForm.adGroup.age.split(',') : []
            this.adGroupForm.gender = this.copyAdForm.adGroup.gender
            if (this.copyAdForm.adGroupId === this.copyAdForm.adGroupId)
              this.opeType = 4
            this.campaignStep = 3
          }
        }
        this.createRenderAdGroup()
        this.createRenderAdList()
      })
    },
    //清空表数据
    clearCreateFromData() {
      this.campaignForm = _.cloneDeep(campaignForm)
      this.campaignForm.campaignName = '推广系列-' + Moment().format("yyyyMMDDHHmmss")
      this.adGroupForm = _.cloneDeep(adGroupForm)
      this.adGroupForm.adgroupName = '广告组-' + Moment().format("yyyyMMDDHHmmss")
      this.adForm = _.cloneDeep(adForm)
      this.renderAdGroupList = []
      this.renderAdList = [[]]
    },
    textCurrentChange(currentPage) {
      this.textPage.current = currentPage;
    },
    showTextSelection(index) {
      this.currentCreativeIndex = index
      this.creativeTextSelection = true
    },
    handleTextSelectionClose() {
      this.creativeTextSelection = false
    },
    handleTextSelectionChange(val) {
      this.textSelectData = val
    },
    confirmTextSelection() {
      if (this.textSelectData.length == 0) return
      const tsd = this.textSelectData.map(item => item.text)
      if (this.adGroupForm.creativeMaterialMode === 'DYNAMIC') {
        if (this.adForm.adList[this.curEditAdgroup].words.length === 1 && this.adForm.adList[this.curEditAdgroup].words[0] === '') {
          if (this.textSelectData.length > 5) {
            return this.$message.error('程序化创意文案最多只能存在5条')
          }
        } else {
          if ((this.textSelectData.length + this.adForm.adList[this.curEditAdgroup].words.length) > 5) {
            return this.$message.error('程序化创意文案最多只能存在5条')
          }
        }
      }
      if (this.currentCreativeIndex == -1) //组合
      {
        if (this.adForm.adList[this.curEditAdgroup].words[0] == '')
          this.adForm.adList[this.curEditAdgroup].words = []
        // this.textSelectData.forEach(item => {
        //   this.adForm.adList[this.curEditAdgroup].words.push(item.text)
        // });
        this.adForm.adList[this.curEditAdgroup].words = _.union(this.adForm.adList[this.curEditAdgroup].words, tsd)
      } else {
        if (this.adForm.adList[this.curEditAdgroup].creativeList[this.currentCreativeIndex].words[0] == '')
          this.adForm.adList[this.curEditAdgroup].creativeList[this.currentCreativeIndex].words = []
        // this.textSelectData.forEach(item => {
        //   this.adForm.adList[this.curEditAdgroup].creativeList[this.currentCreativeIndex].words.push(item.text)
        // });
        this.adForm.adList[this.curEditAdgroup].creativeList[this.currentCreativeIndex].words = _.union(this.adForm.adList[this.curEditAdgroup].creativeList[this.currentCreativeIndex].words, tsd)
      }
      this.createRenderAdList()
      this.creativeTextSelection = false
    },
    searchCreativeText(val) {
      if (this.textSearchData.length == 0)
        this.searchTextData = this.textData
      else {
        this.searchTextData = []
        this.textData.forEach(item => {
          if (item.text.search(this.textSearchData) != -1)
            this.searchTextData.push(item)
          else if (item.platform.search(this.textSearchData) != -1)
            this.searchTextData.push(item)
          else if (item.description.search(this.textSearchData) != -1)
            this.searchTextData.push(item)
          else if (item.language.search(this.textSearchData) != -1)
            this.searchTextData.push(item)
        })
        this.textPage.current = 1
      }
    },
    handleTextCurrentChange(val) {
      this.textPage.current = val
    },
    // 计算天数预算
    countBudgetForDay() {
      let start = this.adGroupForm.scheduleStartTime.split(' ')[0]
      let end = this.adGroupForm.scheduleEndTime.split(' ')[0]
      if (start < end) {
        let dateSpan
        let iDays
        start = Date.parse(start);
        end = Date.parse(end);
        dateSpan = end - start;
        dateSpan = Math.abs(dateSpan);
        iDays = Math.floor(dateSpan / (24 * 3600 * 1000));
        return (iDays + 1) * 20 - 20;
      } else {
        return 20
        // alert("请输入正确的时间");
      }
    },
    countBudgetForEditDays(startDate, endDate) {
      let start = startDate.split(' ')[0]
      let end = endDate.split(' ')[0]
      if (start < end || start === end) {
        let dateSpan
        let iDays
        start = Date.parse(start);
        end = Date.parse(end);
        dateSpan = end - start;
        dateSpan = Math.abs(dateSpan);
        iDays = Math.floor(dateSpan / (24 * 3600 * 1000));
        return (iDays + 1) * 20 - 20;
      } else {
        return 20
      }
    },
    // 清除文案
    clearCreativeText() {
      this.adForm.adList[this.curEditAdgroup].creativeList.forEach(item => {
        item.words = ['']
      })
      this.adForm.adList[this.curEditAdgroup].words = ['']
    },
    // 清空时间段
    clearWeektime() {
      this.weektimeData.forEach(item => {
        item.child.forEach(t => {
          this.$set(t, 'check', false)
        })
      })
    },
    // 版位最终反显
    formatterPlacement() {
      if (this.adGroupForm.placementType === 'PLACEMENT_TYPE_AUTOMATIC') {
        return '自动版位'
      } else {
        return this.placementsList.filter(item => this.adGroupForm.placement.includes(item.value)).map(item => item.label).join(',')
      }
    },
    // 反显优化目标目标
    formatterOptimizationGoal() {
      return this.optimizationGoalList.find(item => item.value === this.adGroupForm.optimizationGoal).label
    },
    // 反显深层事件
    formatterOptimizationEvent() {
      if (this.adGroupForm.optimizationEvent) {
        return this.optimizationEventList.find(item => item.value === this.adGroupForm.optimizationEvent).label
      } else {
        return '无'
      }
    },
    // 反显选择兴趣
    formatterInterest() {
      if (this.adGroupForm.interestCategoryIds.length > 0) {
        return this.tiktokInterestList.filter(item => this.adGroupForm.interestCategoryIds.includes(item.value)).map(item => item.label).join(',')
      } else {
        return '无'
      }
    },
    // 反显视频互动
    formatterVideoRelatedCategory() {
      if (this.adGroupForm.videoRelatedCategoryIds.length > 0) {
        return this.videoRelatedList.filter(item => this.adGroupForm.videoRelatedCategoryIds.includes(item.value)).map(item => item.label).join(',')
      } else {
        return '无'
      }
    },
    // 反显创作者互动
    formatterCreatorRelatedCategory() {
      if (this.adGroupForm.creatorRelatedCategoryIds.length > 0) {
        return this.creatorRelatedList.filter(item => this.adGroupForm.creatorRelatedCategoryIds.includes(item.value)).map(item => item.label).join(',')
      } else {
        return '无'
      }
    },
    // 受众回显
    formatterAudiences() {
      if (this.adGroupForm.audienceIds.length > 0) {
        return this.audiencesRes.filter(item => this.adGroupForm.audienceIds.includes(item.audienceId)).map(item => item.name).join(',')
      } else {
        return '无'
      }
    },
    formatterExcludeAudiences() {
      if (this.adGroupForm.excludedAudienceIds.length > 0) {
        return this.audiencesRes.filter(item => this.adGroupForm.excludedAudienceIds.includes(item.audienceId)).map(item => item.name).join(',')
      } else {
        return '无'
      }
    },
    filterCallToAction(val) {
      return this.callToActionList.find(item => item.value === val).label
    },
    // 程序化创意开关
    handleCreativeMaterialMode(val) {
      if (val === 'DYNAMIC') {
        this.adForm.adList.forEach(item => {
          item.autoCreateType = 2
        })
        // this.adForm.adList[this.curEditAdgroup].autoCreateType = 2
        this.adGroupForm.autoCreateType = 1
        // this.adGroupForm.groupList = this.adGroupForm.groupList.slice(0, 1)
        this.createRenderAdGroup()
      } else {
        this.adForm.adList.forEach(item => {
          item.autoCreateType = 1
        })
        // this.adForm.adList[this.curEditAdgroup].autoCreateType = 1
      }
    },
    // 程序化创意添加文案
    addWordsForDynamic() {
      // console.log(adGroupForm.creativeMaterialMode,this.adForm.words.length)
      if (this.adGroupForm.creativeMaterialMode === 'DYNAMIC' &&
        this.adForm.adList[this.curEditAdgroup].words.length === 5) return
      this.adForm.adList[this.curEditAdgroup].words.push('')
    },
    uploadQiniuCloud(file) {
      const that = this
      const fileData = qiniuTools.getFileData(file)
      const callback = {
        next(res) {
        },
        error(err) {
          this.$message.error("上传图片失败! err => " + err);
        },
        complete(res) {
          const url = 'http://' + fileData.server + '/' + res.key
          that.$set(that, 'logoUrl', url)
          // that.logoUrl = url
        }
      }
      const uploader = qiniuTools.uploadQiniuCloud(file, fileData)
      uploader.subscribe(callback)
    },
    // 处理切换tab栏
    handlerBeforeLeaveTabs(activeName, oldActiveName) {
      if (oldActiveName === 'campaign') {
        if (activeName === 'adGroup') { // 推广系列->广告组
          this.refreshByChangeTabs = true
        } else { // 推广系列->广告
          this.refreshByChangeTabs = true
        }
      } else if (oldActiveName === 'adGroup') {
        if (activeName === 'campaign') { // 广告组->推广系列
          if (this.selectedCampaigns.length > 0) {
            this.refreshByChangeTabs = false
          } else {
            this.refreshByChangeTabs = true
          }
        } else {  // 广告组->广告
          this.refreshByChangeTabs = true
        }
      } else {
        if (activeName === 'campaign') { // 广告->推广系列
          if (this.selectedCampaigns.length > 0) {
            this.refreshByChangeTabs = false
          } else {
            this.refreshByChangeTabs = true
          }
        } else { // 广告->广告组
          if (this.selectedAdGroups.length > 0) {
            this.refreshByChangeTabs = false
          } else {
            this.refreshByChangeTabs = true
          }
        }
      }
      // console.log('激活', activeName)
      // console.log('旧', oldActiveName)
      // console.log(this)
    },
    // 提交模板
    submitTemplate() {
      if (this.isTemplateLoading) return
      this.$refs.templateForm.validate(async valid => {
        if (!valid) return
        this.isTemplateLoading = true
        // console.log(this.$store.getters.userInfo.user_id)
        await saveCustomTtEventTemplate(
          {
            offerId: this.offerId,
            createUser: this.$store.getters.userInfo.user_id,
            name: this.templateForm.name,
            basicEvent: this.tableColumnData.map(item => item.value).join(','),
            appEvent: JSON.stringify(this.tableColumnData),
            attributionEvent: JSON.stringify(this.tableHeaderOpt),
            setting: '',
            filterData: JSON.stringify(this.queryForm)
          }
        ).finally(() => {
          this.isTemplateLoading = false
        })
        this.$message.success('保存模板成功')
        this.templateDialog = false
        await this.getCustomTtEventTemplate()
      })
    },
    async getCustomTtEventTemplate() {
      const {data: res} = await getCustomTtEventTemplate(this.offerId, this.$store.getters.userInfo.user_id)
      this.templateList = res.data
    },
    handleChangeTemplate(val) {
      const temp = this.templateList.find(item => item.id === val)
      this.handleTemplateList(temp)
      this.queryForm = JSON.parse(temp.filterData)
      this.getDataByTab()
    },
    // 处理模板
    handleTemplateList({basicEvent, attributionEvent, appEvent, setting}) {
      const tempArr = this.safeSplitCommon(basicEvent)
      this.tableColumnData = JSON.parse(appEvent)
      this.tableHeaderOpt = JSON.parse(attributionEvent)
      // 基础指标选择框
      this.checkedBaseTarget = []
      this.defaultTableColumnData.forEach(item => {
        if (tempArr.includes(item.value)) {
          this.checkedBaseTarget.push(item.value)
        }
      })
      this.checkAppEvent = []
      this.defaultAppEventColumn.forEach(item => {
        if (tempArr.includes(item.value)) {
          this.checkAppEvent.push(item.value)
        }
      })
      this.checkAttributionEvent = []
      this.defaultAttributionEventColumn.forEach(item => {
        if (tempArr.includes(item.value)) {
          this.checkAttributionEvent.push(item.value)
        }
      })
      this.checkSetting = []
      this.defaultSettingColumn.forEach(item => {
        if (tempArr.includes(item.value)) {
          this.checkSetting.push(item.value)
        }
      })
    },
    handleChangePlacementType(val) {
      this.getLocationTree()
      this.clearLocationParams()
      if (val === 'PLACEMENT_TYPE_NORMAL') {
        this.adGroupForm.placement = ["PLACEMENT_TIKTOK", "PLACEMENT_PANGLE"]
      } else {
        this.adGroupForm.placement = []
      }
    },
    handleChangeEditPlacementType(val) {
      if (val === 'PLACEMENT_TYPE_NORMAL') {
        this.singleEditAdGroupPlacements = ["PLACEMENT_TIKTOK", "PLACEMENT_PANGLE"]
      } else {
        this.singleEditAdGroupPlacements = []
      }
    },
    // 限制上传图片类型
    beforeAvatarUpload(file) {
      var img = file.name.substring(file.name.lastIndexOf('.') + 1)
      const suffix = img === 'jpg'
      const suffix2 = img === 'png'
      const suffix3 = img === 'jpeg'
      const isLt1M = file.size / 1024 / 1024 < 1;
      if (!suffix && !suffix2 && !suffix3) {
        this.$message.error("只能上传图片！");
        return false
      }
      // 可以限制图片的大小
      if (!isLt1M) {
        this.$message.error('上传图片大小不能超过 1MB!');
      }
      return suffix || suffix2 || suffix3
    },
    // 展示保存模板
    showTemplateDialog() {
      this.templateDialog = true
      this.templateForm.name = '自定义模板-' + Moment().format('yyyyMMDDHHmmss')
    },
    // 删除模板
    async deleteTemplate(id, name) {
      console.log(id)
      const confirm = await this.$confirm(`此操作将永久删除${name}模板, 是否继续?`, '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消删除'
        });
      })
      if (confirm) {
        await delCustomTtEventTemplate(id)
        this.$message.success('删除成功')
        await this.getCustomTtEventTemplate()
      }
    },
    //
    emptyForm() {
      // this.$refs.queryForm.resetFields()
      this.queryForm = {
        queryAudienceDate: [Moment().subtract(7, "days").format("yyyy-MM-DD"), Moment().format('yyyy-MM-DD')],
        campaignName: '',
        adgroupName: '',
        adName: '',
        statusList: [],
        locationIds: [],
        placement: [],
        age: [],
        gender: [],
        optimizationGoal: [],
        bidType: [],
        pacing: [],
        billingEvent: [],
        creativeMaterialMode: [],
        creativeType: [],
        campaignTypes: [],
        platformId: [],
        creators: [],
        adTypes: []
      }
    },
    // 检查重名
    async checkCampaignNameForCreate() {
      this.nextStepLoading = true
      const {data: res} = await checkCampaignName({
        platformId: this.campaignForm.platformId,
        campaignName: this.campaignForm.campaignName
      }).finally(() => {
        this.nextStepLoading = false
      })
      if (res.data.code === 200) {
        return true
      } else {
        this.$message.error(res.data.msg)
        return false
      }
    },
    async checkAdGroupNameForCreate() {
      this.nextStepLoading = true
      const {data: res} = await checkAdGroupName({
        platformId: this.campaignForm.platformId,
        adGroups: this.renderAdGroupList.map(item => item.adgroupName).join(','),
        campaignId: this.curCampaipnId
      }).finally(() => {
        this.nextStepLoading = false
      })
      if (res.data.code === 200) {
        return true
      } else {
        this.$message.error(res.data.msg)
        return false
      }
    },
    // 返回app当前图标
    appIconUrl() {
      if (this.campaignForm.os === 1) {
        return this.androidImage
      } else if (this.campaignForm.os === 2) {
        return this.iosImage
      } else {
        return ''
      }
    },
    identityIconUrl(val) {
      const identity = this.identityList.find(item => item.identityId === val)
      if (identity !== undefined && identity.hasOwnProperty('identityIcon')) {
        return identity.identityIcon
      } else {
        return ''
      }

    },
    // 显示创建失败
    showStatusByFail(val) {
      this.getDataByTab()
    },
    // 展示推广系列预算输入框
    showAdgroupBidInput(row) {
      if (row.ttAdgroupId === '' || row.ttAdgroupId === null || row.bidType === 'BID_TYPE_NO_BID') return
      row.showBids = 1
    },
    setAdGroupFrom(val) {

      if (val.videoUserActions === '') {
        this.adGroupForm.videoUserAction = {
          VIDEO_RELATED: [],
          CREATOR_RELATED: []
        }
      } else {
        this.adGroupForm.videoUserAction = JSON.parse(val.videoUserActions)
        // console.log(val.videoUserActions)
      }
      this.adGroupForm.placement = this.safeSplitCommon(val.placement)
      this.adGroupForm.locationIds = this.safeSplitCommon(val.locationIds)
      this.adGroupForm.languages = this.safeSplitCommon(val.languages)
      this.adGroupForm.age = this.safeSplitCommon(val.age)
      this.adGroupForm.householdIncome = this.safeSplitCommon(val.householdIncome)
      this.adGroupForm.interestCategoryIds = this.safeSplitCommon(val.interestCategoryIds)
      this.adGroupForm.interestsByKeywordIds = this.safeSplitCommon(val.interestsByKeywordIds)
      this.adGroupForm.videoRelatedCategoryIds = this.safeSplitCommon(val.videoRelatedCategoryIds)
      this.adGroupForm.creatorRelatedCategoryIds = this.safeSplitCommon(val.creatorRelatedCategoryIds)
      this.adGroupForm.expansionTypes = this.safeSplitCommon(val.expansionTypes)
      this.adGroupForm.interestCategory = val.interestCategory === '' ? [] : JSON.parse(val.interestCategory)
      this.adGroupForm.interestsByKeyword = val.interestsByKeyword === '' ? [] : JSON.parse(val.interestsByKeyword)
      this.adGroupForm.videoRelatedCategory = val.videoRelatedCategory === '' ? [] : JSON.parse(val.videoRelatedCategory)
      this.adGroupForm.creatorRelatedCategory = val.creatorRelatedCategory === '' ? [] : JSON.parse(val.creatorRelatedCategory)
      this.adGroupForm.adgroupName = val.adgroupName
      this.adGroupForm.placementType = val.placementType
      this.adGroupForm.commentDisabled = val.commentDisabled
      this.adGroupForm.videoDownloadDisabled = val.videoDownloadDisabled
      this.adGroupForm.creativeMaterialMode = val.creativeMaterialMode
      this.adGroupForm.gender = val.gender
      this.adGroupForm.videoUserActions = val.videoUserActions
      this.adGroupForm.actionPeriod = val.actionPeriod
      this.adGroupForm.expansionEnabled = val.expansionEnabled
      this.adGroupForm.budgetMode = val.budgetMode
      this.adGroupForm.budget = val.budget
      this.adGroupForm.scheduleType = val.scheduleType
      this.adGroupForm.scheduleEndTime = val.scheduleEndTime
      this.adGroupForm.scheduleStartTime = val.scheduleStartTime
      this.adGroupForm.optimizationGoal = val.optimizationGoal
      this.adGroupForm.optimizationEvent = val.optimizationEvent
      this.adGroupForm.bidType = val.bidType
      this.adGroupForm.roasBid = val.roasBid
      this.adGroupForm.bidPrice = val.bidPrice
      this.adGroupForm.conversionBidPrice = val.conversionBidPrice
      this.adGroupForm.dailyRetentionRatio = val.dailyRetentionRatio
      this.adGroupForm.pacing = val.pacing
      this.adGroupForm.platformId = val.platformId
      this.adGroupForm.appId = val.appId
      this.adGroupForm.deepBidType = val.deepBidType
      this.adGroupForm.scheduleStartTime = Moment().format("yyyy-MM-DD HH:mm:ss")
      this.adGroupForm.scheduleEndTime = Moment().add(14, "days").format("yyyy-MM-DD HH:mm:ss")
      if (val.interestsByKeywordIds.length > 0 && val.interestsByKeyword !== '') {
        this.otherInterestList = JSON.parse(val.interestsByKeyword)
      } else {
        this.otherInterestList = []
      }
      this.adGroupForm.shareDisabled = val.shareDisabled
    },
    setAdForm(val) {
      this.adForm.adList[0].adName = val.adName
      this.adForm.adList[0].adIdentityId = val.identityId
      this.adForm.adList[0].adFormat = val.adFormat
      this.adForm.adList[0].callToActionType = val.callToActionType
      this.adForm.adList[0].impressionTrackingUrl = val.impressionTrackingUrl
      this.adForm.adList[0].clickTrackingUrl = val.clickTrackingUrl
      this.adForm.adList[0].callToAction = val.callToAction
      this.adForm.adList[0].adIdentityName = val.adIdentityName
      this.adForm.adList[0].pageId = val.pageId
      this.adForm.adList[0].landingPageUrl = val.landingPageUrl
      this.adForm.adList[0].imageUrl = val.imageUrl

    },
    // 获取落地页
    async getLandingPageList() {
      if (this.landingPageLoading) return
      this.landingPageLoading = true
      const {data: res} = await getLandingPageList(this.currentAccountId).finally(() => {
        this.landingPageLoading = false
      })
      this.landingPageList = res.data
    },
    handleChangeLandingPage(val) {
      const page = this.landingPageList.find(item => item.value === val)
      this.adForm.adList[this.curEditAdgroup].landingPageUrl = page.landingPageUrl
      this.adForm.adList[this.curEditAdgroup].imageUrl = page.imageUrl
      this.createRenderAdList()
    },
    handleChangeRenderLandingPage(val) {
      const page = this.landingPageList.find(item => item.value === val.pageId)
      let cell = this.finallyTableData.find(item => item.tableIndex === val.tableIndex)
      cell.landingPageUrl = page.landingPageUrl
      cell.imageUrl = page.imageUrl
      this.adForm.adList[this.curEditAdgroup].landingPageUrl = page.landingPageUrl
      this.adForm.adList[this.curEditAdgroup].imageUrl = page.imageUrl
    },
    //编辑广告落地页
    handleEditChangeLandingPage(val) {
      const page = this.landingPageList.find(item => item.value === val)
      this.singleEditAdForm.landingPageUrl = page.landingPageUrl
      this.singleEditAdForm.thumbnailUrl = page.thumbnailUrl
    },
    handleChangePlacement(val) {
      this.getLocationTree()
      this.clearLocationParams()
      // console.log(val)
      if (val.length > 0) {
        this.getOptimizationEventList()
      }
      if (!val.includes('PLACEMENT_TIKTOK')) {
        this.adGroupForm.interestCategory = []
        this.adGroupForm.interestCategoryIds = []
        this.adGroupForm.interestsByKeywordIds = []
        this.adGroupForm.interestsByKeyword = []
        this.adGroupForm.videoUserAction.VIDEO_RELATED = []
        this.adGroupForm.videoRelatedCategory = []
        this.adGroupForm.videoRelatedCategoryIds = []
        this.adGroupForm.actionPeriod = ''
        this.adGroupForm.videoUserAction.CREATOR_RELATED = []
        this.adGroupForm.creatorRelatedCategory = []
        this.adGroupForm.creatorRelatedCategoryIds = []
      }
    },
    handleActionPeriodClick(val) {
      this.adGroupForm.actionPeriod === val ? this.adGroupForm.actionPeriod = '' : this.adGroupForm.actionPeriod = val
    },
    addSameGroupList() {
      this.adGroupForm.groupList.push(_.cloneDeep(this.adGroupForm.groupList[this.adGroupForm.groupList.length - 1]))
      this.createRenderAdGroup()
    },
    // 复制相同app广告组
    async copyMultipleAdGroup(row) {
      if (row) {
        this.copyMultipleAdGroupOptions.appId = row.appId
        this.copyMultipleAdGroupOptions.appName = row.appName
        this.copyMultipleAdGroupOptions.platformId = row.platformId
        this.copyMultipleAdGroupOptions.os = row.os
        this.copyMultipleAdGroupOptions.campaignAppProfilePageState = row.campaignAppProfilePageState
        this.copyMultipleAdGroupOptions.campaignType = row.campaignType
        await this.getAdsByAdGroup(row)
        this.copyAdGroupList = [_.cloneDeep(row)]
        this.copyMultipleAdGroupDialog = true
      } else {
        if (this.selectedAdGroups.length > 0) {
          if (this.selectedAdGroups.length > 1) {
            const appId = this.selectedAdGroups[0].appId
            const campaignType = this.selectedAdGroups[0].campaignType
            if (this.selectedAdGroups.some(item => item.appId !== appId)) return this.$message.error('必须为同APP的广告组')
            if (this.selectedAdGroups.some(item => item.campaignType !== campaignType)) return this.$message.error('必须相同推广类型的广告组')
            // if (this.selectedAdGroups.some(item => item.campaignAppProfilePageState === 'ON')) return this.$message.error('不支持复制APPO')
          }
          this.copyMultipleAdGroupOptions.appId = this.selectedAdGroups[0].appId
          this.copyMultipleAdGroupOptions.appName = this.selectedAdGroups[0].appName
          this.copyMultipleAdGroupOptions.platformId = this.selectedAdGroups[0].platformId
          this.copyMultipleAdGroupOptions.os = this.selectedAdGroups[0].os
          this.copyMultipleAdGroupOptions.campaignAppProfilePageState = this.selectedAdGroups[0].campaignAppProfilePageState
          this.copyMultipleAdGroupOptions.campaignType = this.selectedAdGroups[0].campaignType
          await Promise.all(this.selectedAdGroups.map(item => {
            return this.getAdsByAdGroup(item)
          }))
          this.copyAdGroupList = _.cloneDeep(this.selectedAdGroups)
          this.copyMultipleAdGroupDialog = true
        }
      }

    },
    async getAdsByAdGroup(adGroup) {
      const {data: res} = await getCopyAdgroupDetail({adGroupId: adGroup.id})
      adGroup.ttAdList = res.data.ttAdList
    },
    handleChangeAppo(val) {
      if (val === 'ON') {
        this.adGroupForm.creativeMaterialMode = "CUSTOM"
        // this.disabledCreativeMaterialMode = true
      } else {
        // this.disabledCreativeMaterialMode = false
      }
    },
    handleChangeLandingPageForTable(val, row) {
      const page = this.landingPageList.find(item => item.value === val)
      this.$set(row, 'landingPageUrl', page.landingPageUrl)
      this.$set(row, 'imageUrl', page.imageUrl)
    },
    // 数据排序方法
    sortChange({column, prop, order}) {
      if (prop.startsWith('appEvent.')) {
        this.sortMap.name = prop.substr(9)
      } else {
        this.sortMap.name = prop
      }
      if (order === 'descending') {
        this.sortMap.orderBy = 'desc'
      } else {
        this.sortMap.orderBy = 'asc'
      }

      this.getDataByTab()
    },
    // 批量复制广告
    copyMultipleAd() {
      if (this.selectedAds.length > 0) {
        if (this.selectedAds.length > 1) {
          const appId = this.selectedAds[0].appId
          const campaignAppProfilePageState = this.selectedAds[0].campaignAppProfilePageState
          const platformId = this.selectedAds[0].platformId
          if (this.selectedAds.some(item => item.appId !== appId)) return this.$message.error('必须为同APP的广告组')
          if (this.selectedAds.some(item => item.campaignAppProfilePageState !== campaignAppProfilePageState)) return this.$message.error('必须相同推广类型的广告组')
          if (campaignAppProfilePageState === 'ON' && this.selectedAds.some(item => item.platformId !== platformId)) return this.$message.error('APPO广告必须在同一账户')
          if (this.selectedAds.some(item => item.creativeMaterialMode === 'DYNAMIC')) return this.$message.error('不支持复制ACO广告')
        } else if (this.selectedAds.length <= 20) {
          this.$message.warning('最多只能复制20个广告')
        }
        this.copyMultipleAdOptions.appId = this.selectedAds[0].appId
        this.copyMultipleAdOptions.appName = this.selectedAds[0].appName
        this.copyMultipleAdOptions.platformId = this.selectedAds[0].platformId
        this.copyMultipleAdOptions.os = this.selectedAds[0].os
        this.copyMultipleAdOptions.campaignAppProfilePageState = this.selectedAds[0].campaignAppProfilePageState
        this.copyMultipleAdOptions.campaignType = this.selectedAds[0].campaignType
        this.copyAdList = this.selectedAds
        this.copyMultipleAdDialog = true
      }
    },
    getCampaignSummaries(param) {
      const {columns, data} = param;
      const sums = [];
      columns.forEach((column, index) => {
        if (index === 0) {
          sums[index] = '合计';
          return;
        }
        if (this.campaignTotalData.hasOwnProperty(column.property)) {
          sums[index] = this.campaignTotalData[column.property]
        } else {
          if (column.property && column.property.startsWith('appEvent.')) {
            const property = column.property.substr(9)
            if (this.campaignTotalData.hasOwnProperty('appEvent')) {
              sums[index] = this.campaignTotalData.appEvent[property]
            } else {
              sums[index] = ''
            }
          } else {
            sums[index] = ''
          }
        }
      })
      return sums;
    },
    getAdGroupSummaries(param) {
      const {columns, data} = param;
      const sums = [];
      columns.forEach((column, index) => {
        if (index === 0) {
          sums[index] = '合计';
          return;
        }
        if (this.adGroupTotalData.hasOwnProperty(column.property)) {
          sums[index] = this.adGroupTotalData[column.property]
        } else {
          if (column.property && column.property.startsWith('appEvent.')) {
            const property = column.property.substr(9)
            if (this.adGroupTotalData.hasOwnProperty('appEvent')) {
              sums[index] = this.adGroupTotalData.appEvent[property]
            } else {
              sums[index] = ''
            }
          } else {
            sums[index] = ''
          }
        }
      });
      return sums;
    },
    getAdSummaries(param) {
      const {columns, data} = param;
      const sums = [];
      columns.forEach((column, index) => {
        if (index === 0) {
          sums[index] = '合计';
          return;
        }
        if (this.adTotalData.hasOwnProperty(column.property)) {
          sums[index] = this.adTotalData[column.property]
        } else {
          if (column.property && column.property.startsWith('appEvent.')) {
            const property = column.property.substr(9)
            if (this.adTotalData.hasOwnProperty('appEvent')) {
              sums[index] = this.adTotalData.appEvent[property]
            } else {
              sums[index] = ''
            }
          } else {
            sums[index] = ''
          }
        }
      });
      return sums;
    },
    searchForm() {
      this.getDataByTab()
    },
    createCampaignFromTemp(val) {
      this.$refs.campaignTasks.setCampaignTasksDialog(true)
    },
    // 当前配置应用到所有广告组
    sameAdsforGroup() {
      let cur = this.curEditAdgroup
      this.adForm.adList.forEach((item, index) => {
        if (index !== cur) {
          item.adFormat = this.adForm.adList[cur].adFormat
          item.adIdentityId = this.adForm.adList[cur].adIdentityId
          item.adIdentityName = this.adForm.adList[cur].adIdentityName
          item.callToAction = this.adForm.adList[cur].callToAction
          item.callToActionArr = this.adForm.adList[cur].callToActionArr
          item.callToActionType = this.adForm.adList[cur].callToActionType
          item.creativeList = this.adForm.adList[cur].creativeList
          item.imageUrl = this.adForm.adList[cur].imageUrl
          item.landingPageUrl = this.adForm.adList[cur].landingPageUrl
          item.pageId = this.adForm.adList[cur].pageId
          item.word = this.adForm.adList[cur].word
          item.words = this.adForm.adList[cur].words
          this.curEditAdgroup = index
          this.createRenderAdList()
        }
      })
      this.curEditAdgroup = cur
    }
  }
}
</script>

<style lang="scss" scoped>
* {
  box-sizing: border-box;
}

/deep/ .el-tag__close {
  width: 13px !important;
}

.t-tabs {
  /deep/ .el-tabs__item {
    width: 250px;
  }
}

.drawer-box {
  padding: 0 15px;
  display: flex;
  justify-content: space-between;
  height: 100%;

  .el-input {
    ::v-deep .el-input__inner {
      border-radius: 15px;
    }
  }

  .drawer-box-left {
    border: 1px solid #E8E8E8;
    border-radius: 5px;
    flex: 1;
    margin-right: 15px;
    display: flex;
    flex-direction: column;

    .drawer-box-left-input {
      padding: 15px 20px;
    }

    .drawer-box-left-tab {
      flex: 1;
      overflow: auto;

      .el-tabs {
        height: 100%;
        box-sizing: border-box;
        box-shadow: unset;
        border-bottom: unset;
        border-left: unset;
        border-right: unset;

        .el-checkbox-group {
          display: block;

          .el-checkbox {
            width: 25%;
          }

          .event-checkbox {
            width: 100%;
          }
        }
      }
    }
  }

  .drawer-box-right {
    width: 300px;
    border: 1px solid #E8E8E8;
    border-radius: 5px;
    padding: 15px 20px;
    display: flex;
    flex-direction: column;

    .select-label {
      line-height: 45px;
      height: 45px;
      font-size: 14px;
    }

    .tableHeaderOpt {
      flex: 1;
      overflow: auto;
    }
  }

  .drag-box {
    padding: 5px 0;
    border-bottom: 1px solid #eee;
    display: flex;
    justify-content: space-between;
    cursor: move;

    .drag-box-left {
      color: #101010;
      font-size: 14px;

      i {
        margin-right: 18px;
      }
    }

    .drag-box-right {
      i {
        cursor: pointer;

        &:first-child {
          margin-right: 18px;
        }
      }
    }
  }
}

.campaign-management-box {
  .header {
    position: relative;

    .header-right-box {
      position: absolute;
      z-index: 9;
      right: 0;
    }

    .header-up {
      display: flex;
      justify-content: space-between;

      .date-template {
        .dt-item {
          display: inline-block;
          margin-bottom: 10px;
          margin-right: 10px;
        }
      }

      .yesterday {
        color: green;
      }
    }

  }

  .curd-table {

    .tab-header {
      font-size: 14px;
      margin-bottom: 15px;

      .tab-header-left {
        float: left;

        & > * {
          margin-right: 10px;
        }
      }

      .tab-header-right {
        float: right;

        & > * {
          margin-right: 10px;
        }
      }
    }

    .bottom-page {
      margin-top: 15px;

      .el-pagination {
        float: right;
      }
    }

    .table-body {
      .name-tip {
        width: calc(100% - 12px) !important;

        .name-tip-content {
          display: flex;
          align-items: center;

          .main-tilte {
            padding: 0;
            font-size: 14px;
            font-weight: 600;
          }

          & > * {
            margin-left: 5px;
          }
        }
      }

      .el-link {
        width: 100%;
        font-weight: 400;

        ::v-deep .el-link--inner {
          white-space: nowrap;
          overflow: hidden;
          text-overflow: ellipsis;
        }
      }
    }
  }

  .compaign-detail-wrapper {
    width: 100%;
    display: flex;

    .el-select, .el-input, .el-cascader, .el-autocomplete {
      width: 100%;
      max-width: 400px;
    }

    .compaign-detail-wrapper-left {
      flex: 0;

      .compaign-left {
        display: flex;
        flex-direction: column;
        box-sizing: border-box;
        //padding: 10%;
        padding-right: 20px;
        height: calc(100vh - 164px);
        width: 200px;
        overflow-x: hidden;
        overflow-y: auto;

        .compaign-menu-item {
          margin-bottom: 50px;

        }
      }
    }

    .compaign-detail-wrapper-right {
      position: relative;
      flex: 1;
      height: calc(100vh - 160px);
      overflow: auto;

      .compagin-opt {
        width: calc(100% - 430px);
        height: 60px;
        position: fixed;
        bottom: 0;
        background-color: #ffffff;
        text-align: center;
        line-height: 36px;
        padding: 0 10px;
        display: flex;
        justify-content: center;
        align-items: center;

        .w-btn {
          width: 150px;
        }
      }
    }
  }

  .card-header {
    display: flex;
    justify-content: space-between;
    font-weight: 500;

    .detail-top {
      * {
        margin-top: 10px;
        margin-right: 20px;
      }
    }
  }
}

.el-menu-vertical-demo {
  width: 150px;
}

.container-title-tips {
  font-size: 12px;
  color: #999999;
}

.promotion-target-card {
  display: inline-block;
  position: relative;
  width: 260px;
  height: 126px;
  border: 1px solid #eeeeee;
  border-radius: 5px;
  cursor: pointer;
  margin-right: 15px;
  margin-top: 20px;

  .promotion-target-card-title {
    font-size: 16px;
    margin-top: 18px;
    margin-left: 16px;
    line-height: 16px;
    color: #101010;
  }

  .promotion-target-card-content {
    position: absolute;
    font-size: 12px;
    line-height: 12px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #666666;
    word-break: break-all;
    width: 240px;
  }
}

.current-promotion {
  border: 1px solid #34A9FF !important;
}

.row-tips {
  font-size: 12px;
  color: #999;
  margin-left: 25px;
  margin-bottom: 15px;
}

.compagin-layout {
  display: flex;
  height: 100%;
  overflow: hidden;
  width: 100%;

  .compagin-layout-left {
    flex: 1;
    overflow: auto
  }

  .compagin-layout-right {
    width: 300px;
    overflow: auto
  }
}


.ad-group-card {
  position: relative;
  margin-bottom: 15px;
  border-radius: 5px;
  width: 100%;
  background-color: #f0f0f0;

  .ad-group-card-main {
    display: flex;
    padding: 15px;

    .el-image {
      margin-right: 15px;
    }

    .ad-group-card-content {
      width: 100%;
      height: 100%;
      display: flex;
      flex-direction: column;
      justify-content: space-around;
      font-size: 12px;
    }
  }


  .ad-group-card-close {
    position: absolute;
    right: 15px;
    top: 0px;
  }
}

.el-descriptions {
  background-color: pink;
}

.report-result-title {
  margin-bottom: 15px;
}

.report-opt {
  width: calc(100% - 210px);
  height: 40px;
  position: fixed;
  bottom: 0;
  background-color: #ffffff;
  text-align: center;
  line-height: 36px;
  padding: 0 10px;
  z-index: 999;
}

.creative-drawer-box {
  padding: 0 15px;

  .demo-form-inline {
    .el-select, .el-input {
      width: 150px;
    }
  }

  .bottom-page {
    margin-top: 15px;

    .el-pagination {
      float: right;
    }
  }
}

.over-flow-ellipsis {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.fw400 {
  font-weight: 400;
}

.tiktok-status-display {
  width: 100%;
  align-items: flex-start;
  display: flex;
  justify-content: center;
  flex-direction: column;

  div {
    display: inline-block;
    font-size: 14px;
  }

  span {
    color: #9a9a9f;
  }

}

.el-avatar {
  vertical-align: middle;
}

.campaign-search .el-form-item {
  margin-bottom: 2px !important;
  padding-right: 0px !important;
}

.warning {
  color: #E6A23C;
}

//.campaign-search .el-card__body {
//  padding: 10px !important;
//}

//.identity-upload {
//  ::v-deep .el-upload-list {
//    display: none !important;
//  }
//}
</style>
